ページ幅に基づくjs条件付きの問題

Question

サイドバーメニューをスティッキーにするか、以下のコードを使用してページ幅に基づいてスティッキーにしています。基本的に、ウインドウの幅が768ピクセルを超える場合は "unstick"が偽、768ピクセル未満の場合はtrueを返します。また、ユーザーがページのサイズを変更した場合にも更新されます。

初期ページの読み込み時に正しく動作しますが、サイズ変更時は必ずしもそうとは限りません。ページが> 768を開始し、縮小されると、アンスティックは偽から真に変化します。しかし、それはその方法で固まってしまい、ページが拡大されても元に戻ることはありません。

ページが< 768から始まる場合、アンスティックは本当に設定されていますが、ページのサイズを変更しても何も変わりません。常に変化しません。

条件に問題がありますか？

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

は、この情報がお役に立てば幸いです。