razzh7 / soyeux

基于原生 JS 编写的轮播图

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Soyeux

Soyeux 是一个原生 JS 编写的轮播图,灵感来源于 slickjs

Screenshot

slideloop

Usage

HTML:

<div class="soyeux">
  <div class="single"><h1>1</h1></div>
  <div class="single"><h1>2</h1></div>
  <div class="single"><h1>3</h1></div>
  <div class="single"><h1>4</h1></div>
  <div class="single"><h1>5</h1></div>
  <div class="single"><h1>6</h1></div>
</div>

JavaScript:

new Soyeux('single', {
  slidesToShow: 1,
  slidesToScroll: 1,
  autoplay: true
})

Options

  • pos: number - default(0) - 页面中的第一个轮播图
  • speed: number - default(3000 ms) - 轮播播放速度
  • slidesToShow: number - default(1) - 显示几张图片
  • slidesToScroll: number - defalut(1) - 每次滑动几张图片
  • autoplay: boolean - default(false) - 是否自动播放

About

基于原生 JS 编写的轮播图


Languages

Language:JavaScript 62.0%Language:HTML 28.6%Language:CSS 9.4%