jQuery动画阻止移动滚动

Question

Heelo。 我在模板中使用一些jQuery和CSS来对某些页面元素进行动画处理。 当我向下滚动页面时，元素从左侧和右侧淡入。 我进行了设置，以使动画不会在移动版本上触发。 一切正常，除非我无法向下滚动页面超过移动设备上的某个点。

这是一个预览链接： http : //unbouncepages.com/voxel/

这是我的代码：

$(document).ready(function() {

  //Every time the window is scrolled...
    $(window).scroll( function(){
      // ***Feature Section***
      // Check the location of each desired element
        $('#lp-pom-box-254').each( function(i){

            var bottom_of_object = $(this).position().top + $(this).outerHeight();
            var bottom_of_window = $(window).scrollTop() + $(window).height();

          //If the object is completely visible in the window, fade it it
            if( bottom_of_window > bottom_of_object ){

                $(this).animate({opacity:'1', left:'355px'},900);

            }

        }); 

    });

});

CSS：

#lp-pom-box-254 {
    opacity:0;
    left:0;
  }

对于模糊的解释，我深表歉意，我们将为您提供任何帮助。

Answer 1

我认为你应该改变这一行：

   var bottom_of_object = $(this).position().top + $(this).outerHeight();

对此：

   var bottom_of_object = $(this).offset().top + $(this).outerHeight();

.position（）。top似乎并非在所有地方都有效。 希望对您有所帮助。