jquery desplazarse a la posición div específica en caso de error y enfoque

Question

Tengo un div oculto con mensajes de error específicos en mi formulario. Antes de enviar el formulario, ejecuto una rutina de validación para verificar si todos los campos obligatorios están llenos de texto. Si no, se muestra un div con la clase 'redAlert' justo encima del campo de texto. También quiero que la ventana de diálogo se desplace a esta posición cuando se muestren los mensajes de error. Sé que hay bastantes complementos disponibles para hacer esto, pero quiero hacerlo usando el simple Jquery. Estoy intentando A) Encontrar el primer div visible con la clase redAlert, b) Encontrar su posición llamando a .offset() en este div y luego c) llamar a .scroll() en el objeto de la ventana, pero no estoy obteniendo esto trabajar. Avíseme si me falta algo por completo o si mi sintaxis no es válida (a menudo me he encontrado luchando con el error de sintaxis con Jquery). A continuación está mi código. Además, esto solo encuentra el div visible (suponiendo que haya solo un error div a la vez), ¿puede proporcionarme el selector para encontrar div primero visible con una clase particular?

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

Gracias mucho de antemano.

Answer 1

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

Demostración:http://jsfiddle.net/Cjuve/2/

Answer 2

no creo que va a funcionar.

mirar el código que dejó atrás

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