位置固定 - 水平スクロール

Question

私は、ユーザーが垂直にスクロールすると、サイドバーがユーザーと垂直にスクロールする、左側の垂直サイドバーを持っています。しかし、ウィンドウが小さすぎるとユーザーが水平方向にスクロールすると、垂直サイドバーがウィンドウとともにスライドします。サイドバーが水平方向にスクロールするのを止めるにはどうすればいいのですが、サイドバーを垂直方向にスクロールさせることもできます。

私はこれをしたくありません。

overflow: hidden; 

私はユーザーに横向きにスクロールする機能を持たせたいが、私はちょうどそれらに沿ってくるサイドバーを望んでいない。

$(document).ready(function(){ 
    var top = $("#sidebar").offset().top; 
    $(window).scroll(function(){ 
     var y = $(window).scrollTop(); 
     if (y >= top) { 
      $("#sidebar").addClass('fixed'); 
     } else { 
      $("#sidebar").removeClass('fixed'); 
     } 
    }); 
}); 

と私のCSSは次のとおりです：

これは私のjavascriptのですそして、固定

#sidebar { 
    position: absolute; 
    height: 100%; 
    min-width: 100px; 
    width: 100px; 
    overflow: hidden; 
    background-color: #ededed; 
    border-right: 1px solid #aaa 
    } 
#sidebar.fixed { 
    position: fixed; 
    height:100%; 
    top: 0%; 
    z-index: 1; 
} 

Answer 1

は多分間違っappoachです。

理論的には、上部が変更されている場合は要素の絶対トップ位置を更新することができますが、左プロパティーが変更された場合はスクロールイベントは無視されます。

この小さくて非常に単純な例を見てください。 http://jsfiddle.net/Hbkdt/

注意：これをアニメーション機能と組み合わせて、30-50ミリ秒ごとに起動するようにウィンドウイベントをデバウンスして値を更新することができます。

アニメーションと例をデバウンス：私たちはHTMLを見ることができない場合は、あなたのJavaScriptとCSSを表示http://jsfiddle.net/Hbkdt/1/