JQuery循环滚动图片代码

更新时间：2011年12月08日 23:19:46 作者：

每次滚动的长度不要固定死，可以直接获取图片宽度作为滚动的长度。这样当你的网站有很多地方需要这个效果的时候一个函数就可以搞定了

 
function refresh() { 
var s = $(".box1"); 
if (!s.is(":animated")) 
$(".box1").animate({ marginLeft: "0px" }, "slow", function () { 
$('.box1 img:first').before($('.box1 img:last')); 
$(".box1").css("margin-left", "-206px"); 
}); 
} 
<div class="frame"><div class="box1"><img src="img/001.png" alt="" /><img src="img/002.png" alt="" /><img src="img/003.png" alt="" /><img src="img/004.png" alt="" /></div></div> 
<button type="button"><<</button><button type="button" onclick="refresh()">>></button> 
.box1 
{ 
width:1200px; 
overflow:hidden; 
margin-left:-206px; 
} 
.frame 
{ 
width:620px; 
overflow:hidden; 
} 

图片宽度默认206px，没设定

您可能感兴趣的文章:

循环滚动

简单的jQuery banner图片轮播实例代码
这篇文章主要介绍了简单的jQuery banner图片轮播实例代码的相关资料,需要的朋友可以参考下
2016-03-03
JQuery 进入页面默认给已赋值的复选框打钩
这篇文章主要介绍了JQuery 进入页面默认给已赋值的复选框打钩的实现代码，非常不错，具有参考借鉴价值，需要的朋友参考下吧
2017-03-03
jQuery插件实现非常实用的tab栏切换功能【案例】
这篇文章主要介绍了jQuery插件实现非常实用的tab栏切换功能,涉及jQuery事件响应及页面元素属性动态操作相关实现技巧,需要的朋友可以参考下
2019-02-02
jQuery实现简单聊天室
这篇文章主要为大家详细介绍了jQuery实现简单聊天室，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2020-02-02
跟着JQuery API学Jquery 之三筛选
跟着JQuery API学Jquery 之三筛选，相当于条件判断类型。
2010-04-04
jQuery中toggleClass()方法用法实例
这篇文章主要介绍了jQuery中toggleClass()方法用法,实例分析了toggleClass()方法的功能、定义及对添加或移除匹配元素的一个或多个类进行切换的使用技巧,需要的朋友可以参考下
2015-01-01
jquery 学习笔记传智博客佟老师附详细注释
本人水平有限，在学习时请用批判的态度学习，有问题给我留言传智博客佟老师 jqurey 学习笔记，以及例子代码详细注释。
2009-07-07
jQuery中DOM节点删除之empty与remove
DOM节点删除相信对每个初学jQuery的新手们来说都不陌生，下面这篇文章主要介绍了jQuery中DOM节点删除之empty与remove的相关资料，有需要的朋友可以参考借鉴，感兴趣的下面来一起学习学习吧。
2017-01-01
jquery判断密码强度的验证代码
本文主要介绍了jquery判断密码强度的验证代码，这是一个非常常见的功能，在输入密码的时候提示密码的强度，本文使用jQuery来实现，有需要的小伙伴可以参考下。
2015-11-11
jQuery菜单插件superfish使用指南
Superfish是一款Jquery插件，它能非常容易的建立复杂的多级下拉菜单，Superfish使用也非常普遍。你可能用Superfish实现多种菜单效果。
2015-04-04