これをどのように実装するかは誰にもわかりません。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。 _html/css

これをどのように実装するかは誰にもわかりません。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。 _html/css_WEB-ITnose

WBOY

リリース： 2016-06-24 12:18:15

オリジナル

889 人が閲覧しました

この投稿は、sunjunchao0922 によって 2013-01-05 16:39:24 に最終編集されました

写真に示すように、赤いボックス内の div です。元々はあるべき位置にありましたが、その後、ページをスクロールすると、次のようになります。彼をロールアウトすると、ブラウザの上部で止まりました。これを実現する方法を教えてください。コード例を提供するのが最善です。。

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

2 つのアイデアを提供します:
最初の参考文献 http://guohf.iteye.com/blog/605652
2 つ目: js を使用して実装します。
原則: ウィンドウの位置の位置決め、プレゼンテーションオブジェクトの位置の位置決め。プレゼンテーションオブジェクトがウィンドウの位置にない場合は、プレゼンテーションオブジェクトに絶対位置を与えます。参照
http://javayestome.iteye.com/blog/876021

スクロールバー関連の色の属性:

face-color: スライダーの色

hightlight-color: ハイライトの色

3dlight-color:三次元ライトカラー

darkshadow-color: 影の色

shadow-color: 影の色

arrow-color: 矢印の色

tack-color: スライドカラー

スクロールバーのプロパティ:

over flow:auto は自動です、yes は Yes を意味し、no は No を意味します

overflow-x: 水平スクロールバー

overflow-y: 垂直スクロールバー

これを見てください、比較的単純ですが、しかし重要なのは、それが使えるかどうかです。
デモを見てください。
コアコード:

(function(){    var pos = 0,        qaTitle = $('.gb-qatitle-wrap');    $(window).scroll(function () {        pos = $(document).scrollTop();        if (pos > 150) {            qaTitle.addClass('nomenu');            if(!window.XMLHttpRequest){                qaTitle.css({position: 'absolute',top: pos + 20});            }        } else {            qaTitle.removeClass('nomenu');            if(!window.XMLHttpRequest){                qaTitle.css({position: 'static',top: 'auto'});            }        }    });}());

ログイン後にコピー

div は絶対を使用して配置されていますか?

別のフローティングレイヤーとして、js を使用して位置を制御します

position:fixed;  bottom:100px;

ログイン後にコピー

この div をウィンドウ内の特定の位置に固定するだけです

CSS code?12position:bottom:100px;

ただこの div をウィンドウ内の特定の位置に固定します

そうではありません

これは、スクロールバーイベントがトリガーされたときに js, $(window).scroll(function () {}); で実現できます。 div の位置が画面の上部に達したら、絶対配置または相対配置を使用します。

jsで実現できます、 $(window).scroll(function () {}); スクロールバーイベントがトリガーされたときに、divの位置を決定し、画面の上部に到達したら、絶対配置を使用します。または相対的な位置決めはすぐに完了します。

div の位置が画面の上部にあるかどうかを判断するにはどうすればよいですか?

これを見てください、比較的単純ですが、使えます。
デモを参照してください。
コアコード:
JavaScript コード?12345678910111213141516171819(function(){ var pos = 0, qaTitle = $('.gb-qatitle-wrap'); $(window).scroll(function () { …

少し説明してもらえますか。.gb-qatitle-wrap はその div のクラスであり、nomenu もこの div のクラスですか?

これを見てください。比較的単純ですが、重要なことは次のとおりです。使用可能です
デモをご覧ください
コアコード:
JavaScript code?12345678910111213141516171819(function(){ var pos = 0, qaTitle = $('.gb-qatitle-wrap'); $(window).scroll(function ( ) { …

例を参照はい、わかりましたが、1 つあります。この 1560 が固定数である場合、この div の高さが決定できない場合はどうすればよいですか

次に、その offsetTop を使用します。 div を使用して上の高さを取得します

次に、その div の offsetTop を使用して上の高さを取得します

offsetTop なぜ使い方が間違っているのでしょうか?未定義のようですか？

offsetTop を使用する方法が非常に少ないので、alert($(".gb-qatitle-wrap")[0].offsetTop); と書く必要があることがわかりました。、、、、、、。。。。。。。。。。。

JS イベント
window.onscroll(function(){
// コード...
});

8階 sdyngg_00 さんの回答より引用: js, $(window).scroll(function () {} ); スクロールバーイベントがトリガーされたら、div の位置を決定します。これは、絶対配置または相対配置を使用します。

div の位置が画面の上部にあるかどうかを判断するにはどうすればよいですか?
$("#id").offSet().top == 0
offSet が大文字か小文字かを試してみてください。それ