タブ（タブパイン）を開いてスクロールする方法は？

Question

リンクをクリックして現在のページ（レビュー）のタブを開き、そのページにスクロールします。

$('#openReview').on('click', function() { 
    $('.nav-tabs a[href="#review"]').tab('show'); 
    document.getElementById("review").scrollIntoView(); 
}); 

問題がある：私は

これは私のコードは、リンクをクリックするためのものです..... URLにハッシュを使用したくない私は二回クリックする必要があります！

まず、タブをアクティブにします（2番目のタブ）。次に2回クリックするとスクロールします。

ワンクリックでのみ動作するようにするにはどうすればよいですか？ :)

Answer 1

は、このコードを使用してみてください：

$('#openReview').on('click', function() { 
    $('.nav-tabs a[href="#review"]').tab('show'); 
    $('html, body').animate({ 
     scrollTop: $(".tabs-widget").offset().top 
    }, 2000); 
}); 

あなたはクラスtabs-widgetでより多くの要素を持っている場合、私はあなたの代わりにこの要素にIDを追加し、scrollTopでそれを参照示唆しています。あなたが使用するのではなく、タブの折り返し部にIDを使用している場合、実際には、あなたのコードが動作するEDIT

（私の例では、2秒である）、コードのスクロールアニメーションの再生時間を変更することができます＃レビュー。その理由は、tab（ "show"）が実行されるのに数ミリ秒かかる一方、要素#reviewsはビューにないので、すぐにスクロールすることができないからです。

$('#openReview').on('click', function() { 
    $('.nav-tabs a[href="#review"]').tab('show'); 
    document.getElementById("tabs_widget").scrollIntoView(); 
}); 

... 
<!-- in you HTML --> 
<section class="tabs-widget" id="tabs_widget">