Ver Mensaje Individual
  #2 (permalink)  
Antiguo 15/09/2015, 08:32
Avatar de elporfirio
elporfirio
 
Fecha de Ingreso: octubre-2013
Mensajes: 37
Antigüedad: 11 años, 1 mes
Puntos: 4
Respuesta: código jquery

Código Javascript:
Ver original
  1. jQuery(document).ready(function(){
  2.     !function ($) {
  3.         function go_to_anchor( target ){
  4.              var offset = parseInt($('body').css('paddingTop'));
  5.              $('html, body')
  6.                  .animate({'scrollTop': $(target).offset().top-offset}, 700, 'swing' );
  7.               return false;
  8.         }
  9.      }
  10.  }

1. La primeria linea dice, que al terminar de cargar el documento web haga lo que tiene declarado en su interior;

Código Javascript:
Ver original
  1. jQuery(document).ready(function(){

2. La siguiente linea hace la negación del resultado de una función anonima que recibe como parametro un '$' (en ves de $ podría ser 'A,C,Ñ' etc.)

Código Javascript:
Ver original
  1. !function ($) {

3. declara una funcion con el nombre 'go_to_anchor' y recibes el parametro 'target'

Código Javascript:
Ver original
  1. function go_to_anchor( target ){

4. Del DOM, busca el tag <body> y obten el valor de su padding superior, ese valor conviertelo a entero y guardalo en la variable offset

Código Javascript:
Ver original
  1. var offset = parseInt($('body').css('paddingTop'));

5. Del DOM, busca las tags <html> y <body> a las cuales vas a aplicar la siguiente animación.
Código Javascript:
Ver original
  1. $('html, body')
  2.                  .animate(

A la propiedad 'scrollTop', asignale el valor del offset del parametro obtenido (target), haz que la animación ocurra en 700 milisegundos y realiza la animación mediante el efecto swing

Código Javascript:
Ver original
  1. {'scrollTop': $(target).offset().top-offset}, 700, 'swing' );

6. Al terminar retorna un valor "false"

Código Javascript:
Ver original
  1. return false;

7. Pero como negaste la funcion en el paso 2, entonces ese valor "false" se convierte en "true"

8. Fin

==================================================

En resumen, dado un tag de html, la función hace un scroll hasta la supuesta ubicacion :) del tag.
__________________
visita http://elporfirio.com o habrá tabla ¬¬