文章目录

jQuery无缝滚动插件

目前支持间断和连续的两种方式，支持向左和向上滚动两个方向，支持自定义滚动的速度和间隔时间，支持自定义滚动外层内容和子元素内容，支持一次滚动的图片数量。

使用方法

引入jquery地址并引入本插件地址，添加以下代码：

<script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="scrollForever.js"></script> <script type="text/javascript"> $(function(){ $("#a1").scrollForever(); }) </script>

HTML代码为：

<div> <ul> <li>1</li> <li>2</li> <li>3</li> <li>4</li> <li>5</li> <li>6</li> <li>7</li> <li>8</li> <li>9</li> <li>10</li> <li>11</li> <li>12</li> </ul> </div>

CSS代码

.a{height: 200px; width:800px; overflow: hidden; margin:10px auto;} .a li{height: 198px; width: 198px; border:1px solid #ddd; line-height: 2.4; font-size: 30px; text-align: center; float: left;} 插件参数

参数名字 参数默认值 参数描述

continuous true 是否连续

placeholder 0 非连续滚动时每次的滑动距离，可以自定义，如果没有自定义则根据子元素和滚动数量来决定

dir 'left' 滚动方面，可以为left和top

container 'ul' 外层元素

innner 'li' 子元素

speed 1000 非连续滚动速度

delayTime 0 滚动间隔，非连续滚动为2000ms,连续滚动为20ms,可以自定义

num 1 非连续一次滚动的数量

演示和下载

此处内容需要登录并 发表评论 才可见