は、これは私がクライアントサイト上でこれを達成する方法である:(jQueryのを使用して)
はJavaScript:
if(!$.browser.msie || ($.browser.msie && $.browser.version > 6)){
$('body').append('<div id="listener" rel="generated"> </div>');
$(window).scroll(function() {
if($('#listener').offset().top > 150){
$('body:not(.fixmenu)').addClass('fixmenu');
}else{
$('body.fixmenu').removeClass('fixmenu');
}
});
}
CSS:
#listener{
position: fixed;
top: 0;
right: 0;
height: 1px;
width: 1px;
}
#page #submenu{
position: absolute;
top: 85px;
z-index: 3;
}
.fixmenu #submenu{ position: fixed; }
技術:ページの右上隅に固定の位置付けで目に見えない "リスナー" divを動的に生成する。そのリスナーがページ上部から150ピクセル(またはここに任意の数値を挿入)以上の場合は、<body>
に「fixmenu」クラスを追加します。ここから、CSSを使用してメニューの位置を絶対から固定に変更します。
IE6は固定配置をサポートしていないため、私は除外しました。
偉大なもの、多くのありがとう! – stukerr
注目すべき点:このコードを書いて以来、jQueryは$ .browserを廃止しました。代わりに$ .supportを調べることができます。 –