ページのビューを動かさずに隠しdivを表示

Question

デモページとして機能する一連のdivがあります。当初は最初のdivのみを表示し、残りの2つはjQuery hide（）を使ってページの読み込みを行いました。 各divには、現在のdivを隠してシーケンス内の次のdivを表示するjQueryイベントをトリガーするボタンがあります。

私は非常に最後のdiv（div 3）を表示し、前の2つのdivを表示するようにしましたが、div 3はまだ表示されます。このコード意味、ユーザーは、他の2つのdivを見るために上にスクロールすることができますが、スクロールせずに、彼らはまだ3

$(document).ready(function() { 
    $(".page-2").hide(); 
    $(".page-3").hide(); 
    $(".overlay").show(); 

$(".overlay-button").click(function() { 
    $(".overlay").hide(); 
    $(".page-1").fadeOut(1000); 
    $(".page-2").show("slow"); 

}); 

$(".arrow-down").click(function() { 
    $(".page-2").fadeOut(1000); 
    $(".page-3").show(); 
    $(".page-2").show(); 
    $(".page-1").show(); 


}); 

}); 

のdivを見ますと、バック最初のdiv（」.PAGE-1" までのビューを提供します）。

Answer 1

問題があるのは、ページの高さが開いてスクロールバーが残っている場合、これを修正するにはスクロールバーを次のスニペットを使ってスクロールバーの下にスクロールさせることです：

$('html, body').scrollTop($(document).height());