jsはスクロールバーのスクロールイベントをリッスンして、特定のラベルのコンテンツが常に同じ位置になるようにします_javascriptスキル

ちょっとした知識ポイントですが、これ以上面倒なことはせずに、コードに移動してください

css:

コードをコピー コードは次のとおりです:

<style> <br>#anchor:{ <br>position:absulate; :40%; <br>左:40%; <br>幅:100px; <br>} <br></style</ pre><br&gt ; <BR><BR> <BR>js: <BR></div><BR><BR><div class="codetitle">コードをコピー<span><a style="CURSOR: pointer" data="86119" class="copybut" id="copybut86119" onclick="doCopy('code86119')"><U> コードは次のとおりです。 🎜></U> </a> <pre name="code" class="javascript">var auchorTop = $("#anchor").css("top"); auchorTop = Number(auchorTop. substring(0, anchorTop.indexOf( "p"))); //最初に、リスナーの外側の id=anchor を持つラベルの初期位置を記録します </div>window.onscroll = function () { <div class="codebody" id="code86119">var top = document .documentElement.scrollTop || document.scrollTop; <br>$("#anchor").css("top", anchorTop "px");

🎜>
html:




コードをコピー

コードは次のとおりです。

< div id="anchor">

top=document.documentElement.scrollTop||document.body にスクロール バーのスクロール イベントを追加できます。 listen 関数の .scrollTop; は次のように記述されます。異なるブラウザ間の互換性を避けるために、ここでは chrom ブラウザと ff ブラウザをテストしました。前者は document.body.scrollTop 属性をサポートし、後者は別の属性をサポートします。 '||' これら 2 つの属性を組み合わせるための記号。異なるブラウザと互換性があります。 AnchorTop は、ターゲットの開始点とブラウザの上部の間の距離です。ここで注意する必要があるのは、「#anchor」タグの位置です。absulate です。それ以外の場合、top 属性値は常に 0px です。