jQuery的停止動畫，如果條件

Question

我使用的是不同的@media建立一個網站（最小寬度，最大寬度）來顯示網站主設備上完美。

我有遵循滾動屏幕頂部的菜單，這是jQuery代碼：

var win_width = $(window).width(); 

     if (win_width >= 751) { 
      var el = $('div.menu-header'); 
      var elpos_original = el.offset().top; 
      $(window).scroll(function(){ 
       var elpos = el.offset().top; 
       var windowpos = $(window).scrollTop(); 
       var finaldestination = windowpos; 
       if(windowpos<elpos_original) { 
        finaldestination = elpos_original; 
        el.stop().css({'top':0}); 
       } else { 
        el.stop().animate({'top':finaldestination-elpos_original+30},500); 
       } 
      }); 
     } 
    } 

它工作正常，但如果我在750像素調整窗口的大小，我想停止這個功能並將var el恢復到原始位置。

Answer 1

注意，給予滾動功能將被立即調用，每當用戶將滾動

var el = $('div.menu-header'), 
elpos_original = el.offset().top; 
$(window).scroll (function() { 
    var win_width = $(this).width(); 
     if (win_width >= 751) { 
     var elpos = el.offset().top; 
     var windowpos = $(this).scrollTop(); 
     var finaldestination = windowpos; 
     if(windowpos<elpos_original) { 
      finaldestination = elpos_original; 
      el.stop().css({'top':0}); 
     } else { 
      el.stop().animate({'top':finaldestination-elpos_original+30},500); 
     } 
    } else { 
     $(this).resize(); // calling to handle declared below. 
    } 
}).resize(function() { 
     // Check when resizing whether size is at most 750 
     // and restore original position; 
     if($(this).width() <=750) { 
      el.stop().css("top", "0") 
     } 
})