0

次のようにアンカータグを作成しました

<a href="index.html#top">Top</a>

そして、次のタグを作成しました

<h2 id="top">Header</h2>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. 
   Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, 
   when an  unknown printer took a galley of type and scrambled it to make a type 
   specimen book. It has survived not only five centuries, but also the leap into 
   electronic typesetting, remaining essentially unchanged. It was popularised in the 
   1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more 
   recently with desktop publishing software like Aldus PageMaker including versions 
   of Lorem Ipsum.
</p>

リンクをクリックすると、そのリンクまでスクロールしますが、タグtargetが表示されません。<h2>したがって、少なくともbyscrollの上に必要です。これを克服するのを手伝ってください。そうすれば、仕事はより価値のあるものになります。target10px or 20px

4

3 に答える 3

0

そのようにしてください:tabindexを追加してください

<h2 id="top" tabindex="1" >Header</h2>

focus() を使用する

$("#top").attr("tabindex",-1).focus();

また

または最も簡単な方法は、h2 の近くにアンカー タグを追加し、id="top" を追加することです。

<a id="top"></a><h2>Header</h2>

しかし、私はこれを好みません。

于 2013-10-11T06:31:52.290 に答える
0

最初にアンカータグの href を以下のように変更する必要があります

<a href="#top">Top</a>

次に、jQueryコードの下に記述して、ターゲットまでスクロールできます

    (function() {
       $('a').click(function() {
           $('html, body').animate({
            scrollTop: $("#top").offset().top
            }, 3000);
       });
    });

それが動作します。

于 2013-10-11T06:40:45.303 に答える
0

個人的には、通常、div の上部からいくつかのピクセルを差し引いて、見出しが正常に見えるようにします。次のようにします。

jQuery('html, body').animate({
  scrollTop: jQuery( jQuery(this).attr('href') ).offset().top - 25 
  /* You can minus the pixels */
}, 500);
于 2013-10-11T06:44:05.750 に答える