JQuery循环滚动图片代码


Posted in Javascript onDecember 08, 2011
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,没设定
Javascript 相关文章推荐
表单项的name命名为submit、reset引起的问题
Dec 22 Javascript
Javascript 面向对象 对象(Object)
May 13 Javascript
yepnope.js 异步加载资源文件
Sep 08 Javascript
JavaScript基础篇之变量作用域、传值、传址的简单介绍与实例
Jun 29 Javascript
jQuery实现当前页面标签高亮显示的方法
Mar 10 Javascript
深入理解jquery自定义动画animate()
May 24 Javascript
JavaScript获取当前时间向前推三个月的方法示例
Feb 04 Javascript
jQuery EasyUI 页面加载等待及页面等待层
Feb 06 Javascript
vue.js框架实现表单排序和分页效果
Aug 09 Javascript
从源码里了解vue中的nextTick的使用
Nov 22 Javascript
js中call()和apply()改变指针问题的讲解
Jan 17 Javascript
vue webpack重写cookie路径的方法
Jul 10 Javascript
Javascript类定义语法,私有成员、受保护成员、静态成员等介绍
Dec 08 #Javascript
扩展Jquery插件处理mouseover时内部有子元素时发生样式闪烁
Dec 08 #Javascript
js中document.getElementByid、document.all和document.layers区分介绍
Dec 08 #Javascript
基于jquery的代码显示区域自动拉长效果
Dec 07 #Javascript
5个javascript的数字格式化函数分享
Dec 07 #Javascript
TimergliderJS 一个基于jQuery的时间轴插件
Dec 07 #Javascript
autoPlay 基于jquery的图片自动播放效果
Dec 07 #Javascript
You might like
很好用的PHP数据库类
2009/05/27 PHP
php检测apache mod_rewrite模块是否安装的方法
2015/03/14 PHP
WordPress中限制非管理员用户在文章后只能评论一次
2015/12/31 PHP
PHP定时任务获取微信access_token的方法
2016/10/10 PHP
PHP递归遍历文件夹去除注释并压缩php源代码的方法示例
2018/05/23 PHP
5 cool javascript apps
2007/03/24 Javascript
利用jQuary实现文字浮动提示效果示例代码
2013/12/26 Javascript
用js控制组织结构图可以任意拖拽到指定位置
2014/01/17 Javascript
JS判断文本框内容改变事件的简单实例
2014/03/07 Javascript
JQuery $.each遍历JavaScript数组对象实例
2014/09/01 Javascript
使用JavaScript进行进制转换将字符串转换为十进制
2014/09/21 Javascript
深入分析JQuery和JavaScript的异同
2014/10/23 Javascript
关于JS中prototype的理解
2015/09/07 Javascript
js验证框架实现代码分享
2016/05/18 Javascript
浅谈jQuery中的$.extend方法来扩展JSON对象
2017/02/12 Javascript
ES6学习教程之对象的扩展详解
2017/05/02 Javascript
webpack打包后直接访问页面图片路径错误的解决方法
2017/06/17 Javascript
详解组件库的webpack构建速度优化
2018/06/18 Javascript
微信小程序获取音频时长与实时获取播放进度问题
2018/08/28 Javascript
react项目如何使用iconfont的方法步骤
2019/03/13 Javascript
Flask SQLAlchemy一对一,一对多的使用方法实践
2013/02/10 Python
Python实现信用卡系统(支持购物、转账、存取钱)
2016/06/24 Python
Python中多线程的创建及基本调用方法
2016/07/08 Python
Python中用post、get方式提交数据的方法示例
2017/09/22 Python
Python:Scrapy框架中Item Pipeline组件使用详解
2017/12/27 Python
python tkinter组件摆放方式详解
2019/09/16 Python
Python OpenCV去除字母后面的杂线操作
2020/07/05 Python
Pretty Little Thing爱尔兰:时尚女性服饰
2017/03/27 全球购物
汉语言文学职业规划
2014/02/14 职场文书
测试工程师程序员求职信范文
2014/02/20 职场文书
财务管理专业自荐书
2014/09/02 职场文书
物价局领导班子四风问题整改措施
2014/10/26 职场文书
幼儿园教师个人总结
2015/02/05 职场文书
2015年幼儿园卫生保健工作总结
2015/05/12 职场文书
青年志愿者活动感想
2015/08/07 职场文书
民事调解协议书
2016/03/21 职场文书