次のJQueryを含んだ動きの解説をお願いします。
スクロール位置を取得するコードなのですが、
windowとdocumentの2つに分けている意味がわかりません。
両者の違いはなんですか?
<div class="Codetank-20150827 Codetank__source"> <div class="scrollTop1wrap"> <p>ブラウザのスクロールバーのスクロール位置を取得する</p> <p>(window).scrollTop();</p> <p> ⇒<span class="scrollTop1a"></span></p> <p>$(document).scrollTop();</p> <p>⇒<span class="scrollTop1b"></span></p> </div> </div> <script type="text/javascript"> $(function(){ $(window).scroll(function () { var scrollTop1a = $(window).scrollTop(); $(".scrollTop1a").text(scrollTop1a); var scrollTop1b = $(document).scrollTop(); $(".scrollTop1b").text(scrollTop1b); }); }); </script>
CSS
1 2 3.scrollTop1wrap { 4 background: rgba(0, 0, 0, 0.6); 5 color: #fff; 6 position: fixed; 7 right: 10px; 8 top: 50px; 9 width: 250px; 10 } 11
質問の背景としては、スクロール量に応じて見出し(ヘッダー)を表示するにはどうしたらいいのか?
というのを調べています。
よろしくお願いいたします。
そのコードがどこから出てきたもので、何を意図して書かれたものか教えてください。
解説しているサイトが有りそこに掲載されていました。 https://takuo4649design.com/weblog/note/archives/2182
質問本文に追記された方が目に留まりやすくなります。基本は質問本文を編集してください
了解です!!
回答1件
あなたの回答
tips
プレビュー