ホームページ > ウェブフロントエンド > htmlチュートリアル > Web ページの DIV はスクロールとともにスクロールできますが、top_html/css_WEB-ITnose まで下にスクロールするとページの上部に固定されます。

Web ページの DIV はスクロールとともにスクロールできますが、top_html/css_WEB-ITnose まで下にスクロールするとページの上部に固定されます。

WBOY
リリース: 2016-06-24 11:42:10
オリジナル
1457 人が閲覧しました

http://vacations.ctrip.com/grouptravel/p71671s2.html
教えてください、この中の TAB メニュー項目は、ページが下にスクロールされたとき、またページがその上に引き上げられたとき、常に上部に留まります。それはそれに従うでしょう。

これを達成するにはどうすればよいですか?


ディスカッションへの返信(解決策)

以下のような方法も見たのですが、DIVが揺れてしまい、上記ほど綺麗ではありません。

<html><head>  <title></title></head><body>  <div style="height:960px;background:#330000;">teatteat</div>  <div id="t" style="height:24px;background:#000000;color:#ffffff;text-align:center;">teatteat</div>  <div style="height:960px;background:#333333;">teatteat</div><script type="text/javascript">document.body.onscroll=function(){  if(document.body.scrollTop>=document.getElementById("t").offsetTop){    document.getElementById("t").style.position="absolute";    document.getElementById("t").style.top=document.body.scrollTop;  } else {    document.getElementById("t").style.position="static";    document.getElementById("t").style.top=document.body.scrollTop;  }} </script></body></html>
ログイン後にコピー

リンクアドレス: http://www.cnblogs.com/yjzhu/archive/2013/01/18/2866782.html
上記の記事が LZ の望む効果であるかどうかはわかりません。

リンクアドレス: http://www.cnblogs.com/yjzhu/archive/2013/01/18/2866782.html
上記の記事が LZ の望む効果であるかどうかはわかりません。


はい、これはまさにその効果です、少しキラキラしています、もっと試してみます
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート