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所有