媒體查詢使用Javascript結合起來呢？

Question

當用戶向下滾動頁面時，我有一個位於窗口頂部的粘性邊欄。

它工作正常，在桌面大小，而是調整屏幕平板尺寸時（僅@media屏幕（最小寬度：768px）和（最大寬度：959px）），它不再堅持......

我一定要在媒體查詢添加到我的Javascript？

這裏你可以看到該項目在http://v3.edharrisondesign.com/project/

$('#sticky').scrollToFixed({ 
     marginTop: 20, 
     limit: function() { 
      var limit = $('#foot').offset().top - $('#sticky').outerHeight(true) - 100; 
      return limit; 
     }, 
     minWidth: 1000, 
     zIndex: 999, 
     fixed: function() { }, 
    }); 

    $('#sticky').bind('unfixed', function() { 
     console.log('sticky preUnfixed'); 
    }); 
    $('#sticky').bind('unfixed', function() { 
     console.log('sticky unfixed'); 
     $(this).css('color', ''); 
    }); 
    $('#sticky').bind('fixed', function() { 
     console.log('sticky fixed'); 
     $(this).css('opacity', '1'); 
    }); 
}); 

Answer 1

你已經得到了minWidth屬性設置爲1000的#sticky。這意味着窗口寬度必須至少爲1000px寬;否則，它會自動關閉。除去它，或者使其足夠小以適應所需的尺寸，並且它應該起作用。

換句話說，使這樣的：

$('#sticky').scrollToFixed({ 
    marginTop: 20, 
    limit: function() { 
     var limit = $('#foot').offset().top - $('#sticky').outerHeight(true) - 100; 
     return limit; 
    }, 
    minWidth: 768, 
    zIndex: 999, 
    fixed: function() { }, 
});