/* 
 * Tutorial: Volver a la cabecera con jQuery
 * url: http://www.innominepixel.com/jquery/tutorial-volver-a-la-cabecera-con-jquery.html
 * Fecha: 14/12/2010
 * Autor: Osiris Magro Márquez
 * Licencia: Creative Commons By http://creativecommons.org/licenses/by/3.0/es/
 * www.innominepixel.com
 */

$(document).ready(function(){

    /*
     * Observamos el evento "scroll" en la ventana
     * Si la posición del scroll (scrollTop) es mayor de cero, mostramos el elemento ".goUp",
     * Si no, ocultamos el elemento
     **/
    $(window).scroll(function(){ 
	if ($(window).scrollTop() > 0){
	    $('.goUp').fadeIn();
	} else {
	    $('.goUp').fadeOut();
	}
    });

    /*
     * Al hacer click en el elemento ".goUp", volvemos arriba con una animación.
     * Comprobamos si el navegador es webkit (Chrome y Safari) ya que no funcionan con 'html'
     * Es importante comprobar que body y html no están animados.
     **/
    $('.goUp').click(function(){
	if ($.browser.webkit){
	    $('body:not(:animated)').animate({scrollTop:0},'slow');
	} else {
	    $('html:not(:animated)').animate({scrollTop:0},'slow');
	}

    });
});

/*
 * NOTAS
 * Al ejecutar la animación, en el código comprobamos si el navegador es webkit.
 * Esto es debido a que IE, Firefox y Opera, soportan la animación en 'html' pero Chrome y Safari no.
 * La otra posibilidad es usar 'html,body', pero Opera soporta las animaciones en los dos
 * elementos y provoca un extraño bug, así que es la forma mas simple que se me ha ocurrido.
  **/