我在哪裏做我的錯誤在我的JS代碼

Question

我堅持爲什麼這段代碼不工作。爲什麼當我向下滾動窗口時圖像位置不固定。

我知道這是一個非常普遍的問題，將不勝感激。

$(window).scroll(function() { 
 
    if($(window).scrollTop() === 200){ 
 
    \t $("#dataImg").css({'position':'fixed','top':'0px'}); 
 
    } 
 
});

.container { 
 
    height: 1500px; 
 
    background: #000; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="container"> 
 
<img src="http://www.placehold.it/200x300" id="dataImg"> 
 
</div>

Answer 1

我認爲這個問題是用 「$（窗口）.scrollTop === 200」。你想用>或<根據您的情況是這樣的：

$(window).scroll(function() { 
    if($(window).scrollTop() > 200){ 
    $("#dataImg").css({'position':'fixed','top':'0px'}); 
    } 
}); 

Answer 2

我想你想你的時候超過200像素向下滾動，以修復圖像。 你可以改變你的Javascript代碼如下：

$(window).scroll(function() { 
    if($(window).scrollTop() >= 200){ 
     $("#dataImg").css({'position':'fixed','top':'0px'}); 
    } else { 
     $("#dataImg").css({'position': '', 'top' : ''}); 
    } 
});