jqueryは、エラーとフォーカスの場合に特定のdiv位置にスクロールします

Question

フォーム全体に特定のエラーメッセージを含む非表示のdivがあります。フォームを送信する前に、すべての必須フィールドにテキストが入力されているかどうかを確認する検証ルーチンを実行します。そうでない場合は、クラス 'redAlert'を持つdivがテキストフィールドのすぐ上に表示されます。また、エラーメッセージが表示されたら、ダイアログウィンドウをこの位置に右にスクロールさせたいと思う。私はこれを行うために利用できるプラグインがかなりあることを知っていますが、私は単純なJqueryを使ってそれをやりたいのです。私はしようとしている）クラスredAlertで最初の可視divを見つける、b）このdivの.offset（）を呼び出して位置を見つける、c）ウィンドウオブジェクトで.scroll（）を呼び出すが、これを取得していない働く私が何かを完全に見逃しているか、構文が有効でないかどうかを教えてください（私はJqueryの構文エラーに苦しんでいることがよくあります）。以下は私のコードです。 また、これは可視divを見つけるだけです（一度にエラーdivが1つしかないと仮定します）、特定のクラスで最初に表示されるdivを見つけるセレクタを教えてください。

var errorDiv = $('.redAlert:visible').attr("id"); 
var scrollPos = $("#"+errorDiv).offset(); 
//alert(scrollPosition); // This alert always says 'null', why ? 
$(window).scroll(scrollPos); 
//Also tried scrollTo(); 

ありがとうございます。

Answer 1

var errorDiv = $('.redAlert:visible').first(); 
var scrollPos = errorDiv.offset().top; 
$(window).scrollTop(scrollPos); 

デモ：http://jsfiddle.net/Cjuve/2/

Answer 2

私はそのつもりがうまくいかないと思います。私は

$('html, body').animate({ 
    scrollTop: ($('.error').first().offset().top) 
},500);