停止滾動元素並使其返回到開始位置，當滿足特定頁面寬度時

Question

我希望Spotify iframe在用戶進入頁面時跟隨用戶。我已經實現了這一點：

$(window).scroll(function() { 
var $scrollingDiv = $("#spotifyIframe"); 

$(window).scroll(function(){ 
$scrollingDiv 
    .stop() 
    .animate({"marginTop": ($(window).scrollTop())/1.5 + "px"}, "slow"); 
    }); 
}); 

唯一的問題是，當頁面的寬度大於700像素越小，IFRAME去段落下方，讓它滾動到無窮大。

我試着把這個函數放在一個if語句中，並且它的編號爲$(window).width() < 700，它有效，但唯一的問題是當頁面寬度變得大於700px時，滾動函數沒有再次啓動。

下面是我在做看起來像什麼網站：

Answer 1

嘗試聽resize()事件：

$(window).scroll(function() { 
var $scrollingDiv = $("#spotifyIframe"); 
var largerThen700 = $(window).width() > 700; 

$(window).resize(function(){ 
    largerThen700 = $(window).width() > 700; 
}); 

$(window).scroll(function(){ 
    if(largerThen700){ 
    $scrollingDiv 
     .stop() 
     .animate({"marginTop": ($(window).scrollTop())/1.5 + "px"}, "slow"); 
    }); 
    } 
});