无法使此语句起作用

Question

我希望我的元素仅在 offset().top 大于 300 像素时显示位置固定

这是我的代码：

$(window).scroll(function() {   
    if ($(window).offset().top > 300) {
        $(".uparrow").css('position','fixed');
    }
    else {
        if ( $(window).offset().top < 300) {
            $(".uparrow").css('display','none');
        }
    }
})

Answer 1

您的浏览器控制台就是您的朋友。这会立即告诉你哪里出了问题。在这种情况下，您会在控制台中收到错误 Uncaught TypeError: Cannot read property 'top' of undefined - 这将引导您解决问题。

你需要$(window).scrollTop() 而不是$(window).offset().top

您也不需要第二个 if 语句。这在您之前的 else 语句中涵盖了

I.E

$(window).scroll(function()
   {   
     if ( $(window).scrollTop() >= 300)    
     {
         $(".uparrow").css('display','inline-block');
         $(".uparrow").css('position','fixed'); // <- this is pretty pointless given you never change it when less than 300 pixels.
         console.log('I am fixed');
     }
     else 
     {
       $(".uparrow").css('display','none');
       console.log('I am hidden');
     }
  })