西安做网站_西安网站建设公司_西安网页制作_西安网页设计_西安网站制作设计公司

 找回密码
 注册

QQ登录

只需一步,快速开始

搜索
查看: 4449|回复: 0

Jquery 无缝滚动

[复制链接]
发表于 2013-11-24 01:17:52 | 显示全部楼层 |阅读模式
  1. <script type="text/javascript">
  2.     jQuery.fn.extend({
  3.         pic_scroll:function (){
  4.             $(this).each(function(){
  5.                 var _this=$(this);//存储对象
  6.                 var ul=_this.find("ul");//获取ul对象
  7.                 var li=ul.find("li");//获取所有图片所有的li
  8.                 var w=li.size()*li.width();//统计图片的长度
  9.                 li.clone().prependTo(ul);//克隆图片一份放入ul里
  10.                 ul.width(2*w);//设置ul的长度,使所有图片排成一排
  11.                 var i=1,l;
  12.                 _this.hover(function(){i=0},function(){i=1});//鼠标经过时设置i=0达到鼠标经过停止效果
  13.                 setInterval(function(){
  14.                     //定时滚动函数
  15.                     l = _this.scrollLeft();
  16.                     if (l < w) {
  17.                         _this.scrollLeft(l+i);
  18.                     } else {
  19.                         _this.scrollLeft(0);
  20.                     }
  21.                 },20);
  22.             })
  23.         }
  24.     });
  25.     $(document).ready(function(){
  26.         $(".a,.aa").pic_scroll();//多个地方使用
  27.     })
复制代码
西安网站建设 | 西安做网站 —— 剑锋所指 所向披靡!
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 注册

本版积分规则

QQ|小黑屋|手机版|Archiver|西安网站建设

GMT+8, 2020-8-9 12:50 , Processed in 0.051944 second(s), 15 queries .

Powered by Discuz! X3.4

Copyright © 2001-2020, Tencent Cloud.

快速回复 返回顶部 返回列表