Question

我想在滚动到固定位置时移动图片，我想在向下滚动800px时移动图片。

我的问题是，当我向下滚动时，图像正在移动，但在向下移动时，它会闪烁，当我向上滚动时也会这样做。

使用Javascript：

    if ($(window).width() >= 1024) {

    $(window).scroll(function(){
        if ($(window).scrollTop() >= 800){
              $('.Pic_mv').each(function (i) {
                $(this).toggleClass('scrolled');
            });
        }else if ($(window).scrollTop <= 800){
               $('.Pic_mv').each(function (i) {
                $(this).toggleClass('.Pic_mv');
            });
        }  
    }) ;
}

CSS：

  .Pic_mv {
    border-radius: 100%;
    margin-top: 30px;
    margin-bottom: 25px;

    transition: transform 300ms ease-in-out;

}
.Pic_mv.scrolled {
     transform: translate(85%, 1300px)  ;

}

我怎样才能获得流畅的动画？

Answer 1

如果我真的明白了，你想要从顶部滚动到800px时修复图像。我没有使用任何类型的动画，只是classadd和删除。我相信你的代码问题是;你没有在.scrolled类上给出display：fixed属性。

查看链接Here并告诉我，如果我错过了解，你到底想要得到什么。

滚动时移动图像（Javascript）

1 个答案: