Javascript 停止滚动元素，当达到某个页面宽度时，让它返回到开始的位置

我希望Spotify iframe在用户进入页面时跟踪他们。我通过以下方式实现了这一点：

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

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

唯一的问题是，当页面宽度小于700px时，iframe会在段落下方移动，使其滚动到无穷大

我试着用

$（window.width（）<700

）将函数放入

if

语句中，它有点工作，但唯一的问题是当页面宽度大于700px时，滚动函数没有重新启动

以下是我正在创建的网站的外观：

尝试收听以下活动：

$(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");
    });
  }
});