Question

这是我的情景，

我的网页上有4张图片，名为img1，img2，img3，img4。

现在我的网页上还有4张图片名为fly1，fly2，fly3，fly4

现在，我的屏幕上有一个名为＆＃39; Done＆＃39;的按钮。当我点击它时，底部显示的图像应飞行并固定在顶部显示的图像上，如下图所示，

fly1 fly and fix over img3
fly2 fly and fix over img1
fly3 fly and fix over img4
fly4 fly and fix over img2

为了更好地理解我已将我的代码放在jsffiddle中，请记下它。

无论如何我无法实现

请指导我

此致阿伦

Answer 1

根据您分享的js fiddle链接，代码中唯一需要更改的是向飞行图像的CSS添加position: absolute属性

$("#fly1").css({
    "top": v.top + "px",
    "left": v.left + "px",
    "position": "absolute",
});

这是一个有效的fiddle。

没有绝对位置，html元素有一个默认的static位置值，因为元素按照文档流程中出现的顺序呈现

Answer 2

这将为您提供更好的开始

$(document).ready(function() {
    $("#b").animate({top: "+=500"}, 2000);
    $("#b").animate({top: "-=300"}, 1000);
});