使用动画一次滑动超过1个img
使用动画一次滑动超过1个img
提问于 2014-02-02 07:55:04
我想为合作伙伴徽标创建滑块。我有脚本，这是移动一个元素。如何在一个时间内收集所有图像并移动所有图像？
脚本：
$(document).ready(function(){
var w = $("#partners").width();
$(".img").css({left: w-50});
var f = function(){
$(".img").animate({left: 0},5000,function(){
$(".img").css({left: w-50});
f();
});
};
f();
});我的img正在移动到文档的末尾，f()再次调用(类似于循环)。我需要用一个以上的图像来做。
回答 2
Stack Overflow用户
发布于 2014-02-02 08:10:39
您正在使用的代码被设置为在类上工作。因此，只需使用该类标记其他元素即可使多个元素具有动画效果。下面是一个简单的示例(更新后的动画步进)：
html
<div id="partners" style="width:50px;"></div>
<div class="img">Me</div>
<div class="img">Mini Me</div>
<div class="img">Mini Me Me</div>
<div class="img">Mini Me Me Me</div>css
.img{
position:relative;
}js -为了步进动画，跟踪索引并按长度修改它，以确保它环绕(在本例中为i)
var w = $("#partners").width();
$(".img").css({left: w-50});
var f = function(i){
i = i % $(".img").length;
$(".img").eq(i).animate({left: 0},750,function(){
$(".img").eq(i).css({left: w-50});
f(i+1);
});
};
f(0);Stack Overflow用户
发布于 2014-02-02 08:00:56
你能把它们都放在一个div中，然后把它移走吗？例如
<div id="imagesmoving"> <img></img> <img></img> <img></img> <img></img> <img></img></div>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/21505288
复制相关文章
相似问题
腾讯云开发者
