Html、Javascript或Css云计算

我正在尝试创建一个类似于此页面上云的幻灯片效果：

使用javascript（JQuery）、css或html。 我当前的代码不工作（我正在使用Chrome）

.集装箱{
位置：绝对位置；
宽度：300px；
高度：300px；
溢出：隐藏；
}
.图像容器{
位置：绝对位置；
填充：0；
保证金：0；
}
函数animate（）{
$（“.scroll image”）.animate（{“left”：“+=500px”}，3000，“linear”，
函数（）{
$（this.css（{“left”：“-=500px”}）；
制作动画（）；
});
}
制作动画（）；

---

有什么帮助吗？

试试这样的方法：

标记：

<div class="bg"></div>

var bgPos = 0;
setInterval(function() {
    $(".bg").css("background-position", (bgPos-= 1) + "px");
}, 60);

jQuery：

<div class="bg"></div>

var bgPos = 0;
setInterval(function() {
    $(".bg").css("background-position", (bgPos-= 1) + "px");
}, 60);

应该是这样的：

播放

setInterval

时间和移动时间的像素量，直到获得所需效果。

HTML

<div class="container">
    <div class="images-container">
    </div>
</div>

jQuery

function animate() {
    $(".images-container").animate({"background-position": "-=5"}, 200, "linear")
}

setInterval(animate, 200)

---

使用

动画（…，…，线性）

则动画不会跳跃

简单高效。很好看：）在OP展示的网站上，它确实完全落后于我的控制台，但到底出了什么问题？

function animate() {
    $(".images-container").animate({"background-position": "-=5"}, 200, "linear")
}

setInterval(animate, 200)