Javascript Scrolltop（）（无法反转动画）

嘿，我试着让两个div分别向左移动10%和向右移动10%，让它们彼此离开。它们将在1000之后彼此移出，但在我向后滚动到1000之前后不会向后移动

$(document).ready(function(){

var jq  = $("#jqimg")
var kevin = $("#kevinimg")


 $(window).scroll(function () {

      if ($(this).scrollTop() > 1000) {
        kevin.animate({
            marginLeft: "10%",
        },600);

        jq.animate({
            marginRight:"10%",
        },600);

      } 

  });
});

我试着加上这个，但这只是打破了它

   else {
        kevin.animate({
            marginLeft: "0%",
        },600);

        jq.animate({
            marginRight:"0%",
        },600);

      }

---

有人有解决方案吗？

这是因为上一个动画没有完成。使用

queue:false

防止动画链接。并使用

marginLeft:null

而不是

0%

从样式属性中删除margin属性

另一种方法是使用或。但在这种情况下，您将在元素上释放另一个动画过程

---

你能分享一下你的html结构吗，特别是关于图像元素的放置方式和它们的css样式属性？

$(window).scroll(function() {
    if ($(this).scrollTop() > 1000) {
        $('div').animate({
            marginLeft: '10%'
        }, {
            queue: false
        });
    } else {
        $('div').animate({
            marginLeft: null
        }, {
            queue: false
        });
    }
});

$(window).scroll(function() {
    if ($(this).scrollTop() > 1000) {
        $('div').stop().animate({
            marginLeft: '10%'
        });
    } else {
        $('div').stop().animate({
            marginLeft: null
        });
    }
});