联系我们
简单又实用的WordPress网站制作教学
当前位置:网站首页 > 网页前端技术 > 正文

JQuery循环滚动图片代码 - Web前端

作者:98wpeu发布时间:2026-07-16分类:网页前端技术浏览:4


导读:复制代码代码如下:functionrefresh(){vars=$(".box1");if(!s.is(":Animated"))$(".box1").anima...
复制代码 代码如下:
functionrefresh() {
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,没设定

标签:代码图片WebJQuery


网页前端技术排行
最近发表
网站分类
标签列表