css fixedレイアウトでスクロールバーの問題が発生しないことを解決
5098 ワード
必要なのは、ページが一定の高さに移動すると、上部に固定されたナビゲーションバーが表示され、ナビゲーションバーにスクロールバーが付いていることです.
CSSはよく実現したが、ナビゲーションバーが上部に浮かんだ後、スクロールバーはどうしても表示されず、いくつかの資料を探してやっと解決し、メモを取った.
転載先:https://www.cnblogs.com/joe235/p/11531754.html
CSSはよく実現したが、ナビゲーションバーが上部に浮かんだ後、スクロールバーはどうしても表示されず、いくつかの資料を探してやっと解決し、メモを取った.
<div class="top_nav">
<div class="navTab">
<label > label><label > label><label > label>
<label > label><label > label><label > label>
div>
div>
.navTab{width:100%;height:0.8rem;line-height:0.8rem;font-size:.32rem;background:#ff0;
display: flex;flex-direction: row;white-space: nowrap;overflow-x: scroll;z-index: 99;}
.navTab label{margin-right: 0.3rem;display: inline-block;}
.fixnav {position: fixed;top: 0; bottom: 0;width: 100%;height: auto;
overflow-x: scroll;overflow-y: hidden;z-index: 99;}
<span style="color:#000000;">
$(</span><span style="color:#0000ff;">function</span><span style="color:#000000;">() {
$(</span>".top_nav"<span style="color:#000000;">).hide();
$(window).scroll(</span><span style="color:#0000ff;">function</span><span style="color:#000000;">() {
</span><span style="color:#0000ff;">if</span>($(document).scrollTop() >= 200<span style="color:#000000;">) {
$(</span>".top_nav").addClass("fixnav"<span style="color:#000000;">).slideDown();
} </span><span style="color:#0000ff;">else</span><span style="color:#000000;"> {
$(</span>".top_nav"<span style="color:#000000;">).hide();
}
})
})
</span>
転載先:https://www.cnblogs.com/joe235/p/11531754.html