Question

我正在尝试使用下面的代码根据页面宽度使侧边栏菜单变粘或不粘。基本上，如果窗口宽度超过768像素，则“unstick”应为false，如果小于768px则为true。如果用户调整页面大小，它也应该更新。

它在初始页面加载时正常工作，但在调整大小时并非总是如此。如果页面开始＆gt; 768，并且减少了，从非虚假变为真，就像我想要的那样;但是它会被这种方式卡住，如果页面被放大，它就不会改变。

如果页面开始＆lt; 768，unstick开始设置为true，就像我想要的那样，但是调整页面大小不会改变任何东西 - 它总是保持正确。

我的条件有问题吗？

$(function(){
  $(window).resize(function(){
     if($(this).width() >= 768){
         jQuery('#info').containedStickyScroll({
             duration: 0,
             unstick: false
         });
     } else {
         jQuery('#info').containedStickyScroll({
             duration: 0,
             unstick: true
         });
     }
  })
  .resize();//trigger resize on page load
});

Answer 1

看起来你的插件没有删除它的旧事件/ dom元素。每次调用.containedStickyScroll时，它都会保留一些以前的选项。

以下是我要解决的问题：

$(function(){
    $(window).resize(function(){
        if($(this).width() >= 768){
            jQuery('#info').containedStickyScroll({
                duration: 0,
                unstick: false
             });
             $(".scrollFixIt").remove();
             $(window).unbind("scroll");
         } else {
             jQuery('#info').containedStickyScroll({
                 duration: 0,
                 unstick: true
             });
         }
    })
    .resize();//trigger resize on page load
});

希望这有帮助。

基于页面宽度的js条件问题

1 个答案: