自動スクロール要素

Question

記事を含む要素があります（驚きです）。

記事の冒頭にタグのリストがあります。 ユーザーがタグをクリックすると、記事内の一致する単語が強調表示されます。

私が問題を抱えているのは、自動的に強調表示された単語にスクロールしています。

javascript/jQueryでこれを行う方法はありますか？

次は私のコード語を見つけ、それを強調するためである。

$(".article-tags a.toggle").live("click", function() { 
     var $this = $(this); 
     var $p = $this.closest("p"); 
     if ($p.find("span.highlight").length == 0) { 
      $("#viewer .article-body").highlight($this.text()); 
      $this.highlight($this.text()); 
      document.getElementById("viewer").scrollTop = $p.find("span.highlight").offsetTop; 
     } 
     else { 
      $("#viewer .article-body").removeHighlight(); 
      $p.removeHighlight(); 
     } 
     return false; 
    }); 

感謝。

Answer 1

これを達成するにはいくつかの方法があります。

• scrollTopセットでjQuerys .animate()elements.offset().top
• $(window).scrollTop(element.offset().top);
• element.scrollIntoView();

.scrollIntoView()にあなたが直接DOMノード上で呼び出すことができるネイティブメソッドです。

Answer 2

$('span.highlight').first().prepend('<a class="highlighted" name="hightlighted" />'); 
window.location.hash = '#highlighted'; 

これでいいはずです。要素の直前にアンカーを追加してからスクロールします。これまでに$('a.highlighted').remove()を入れて以前の追加をクリアしたい場合があります。