Question

我使用此代码在滚动时让元素淡入：

    <script language="JavaScript">
        $(document).ready(function() {
           $(window).scroll( function() {
              $('#floatingDIV4').each( function() {
                 var bottom_of_object = $(this).position().top + $(this).outerHeight();
                 var bottom_of_window = $(window).scrollTop() + $(window).height();

                 if (bottom_of_window > bottom_of_object) {
                     $(this).animate({'opacity':'1'}, 500);
                 }
              });
           });
        });
    </script>

我试图找到一个代码，使出现在滚动的元素在顶部位置淡出，但我找不到任何代码。你有什么想法吗？

编辑：
答案非常好，但代码不起作用。

Answer 1

使用此

 if (bottom_of_window > bottom_of_object) {
                 $(this).animate({ scrollTop: 0, opacity: 0  },'slow');
             }

如果这个答案是正确的，请将其标记为其他人的答案....

Answer 2

if (bottom_of_window > bottom_of_object) {
             $(this).animate({ scrollTop: 0,
                               opacity: 0 
                             },'slow');
         }

这将滚动到顶部，同时淡出。但是，如果您只是在完成移动到顶部时寻找淡化代码，则可以使用：

    if (bottom_of_window > bottom_of_object) {
             $(this).animate({ scrollTop: 0,}, 
                     complete: function(){
                         $(this).animate({opacity:0})
                     )};
      }

但是当盒子褪色时盒子是可见的，scrollTop:值需要高于0，例如。 px中框的高度。

Answer 3

可能对您有所帮助

function show_coords(event)
{
    var x=event.clientX;
    var y=event.clientY;
    alert("X coords: " + x + ", Y coords: " + y);
}

将X，Y的值与某个预定义值进行比较

我如何检测是否在顶部位置查看

3 个答案: