https://github.com/yanhaijing/jquery.imagesscrolling.js
jquery 图片滚动插件
https://github.com/yanhaijing/jquery.imagesscrolling.js
Last synced: 4 months ago
JSON representation
jquery 图片滚动插件
- Host: GitHub
- URL: https://github.com/yanhaijing/jquery.imagesscrolling.js
- Owner: yanhaijing
- License: mit
- Created: 2013-01-22T06:46:02.000Z (over 12 years ago)
- Default Branch: master
- Last Pushed: 2013-09-03T02:44:05.000Z (almost 12 years ago)
- Last Synced: 2025-01-31T11:01:53.001Z (4 months ago)
- Language: JavaScript
- Homepage: http://plugins.jquery.com/imagesScrolling/
- Size: 137 KB
- Stars: 6
- Watchers: 4
- Forks: 5
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: MIT-LICENSE.txt
Awesome Lists containing this project
README
jquery.imagesScrolling.js
=========================jquery 图片滚动插件
能实现图片循环滚动播放,支持自定义速度。
介绍:
定义父元素的定位为relative,作为子元素定位基点,循环移动子元素left,实现循环移动
可自定义速度,自定义每次移动长度,自定义子元素宽度
参数:options参数是一个对象,包含三个值
options.speed 每个多长时间移动一次,单位毫秒(默认值:50)options.step(string|number|null) 每次移动长度 (默认值 1)
step可选值:'auto','outer','inner','width',number,不传入
'auto':步长为width+padding+border+margin
'outer':步长为width+padding+border
'inner':步长为width+padding
'width':步长为width
number:步长为传入值
null:步长为默认值1
options.width 元素的宽度 (默认值 子元素width+padding+border+margin)Example:
js:
$('#test').imagesScrolling();
html
![]()
![]()
css:
.test{
position:relative;
border:solid 1px #0f0;
height:200px;
overflow:hidden;
width:1120px;
margin:auto
}
.test div{
position:absolute;
height:200px;
width:260px;
margin:0 10px
}
.test div img{
width:100%;
height:100%
}
#[更多例子](http://yanhaijing.github.io/jquery.imagesScrolling.js/example/demo.html)
许可:
本程序遵从MIT许可,但图片来自QQstyle,归tencent所有