Foros del Web » Programando para Internet » Jquery »

APORTE: scroll facil con jquery (= focus)

Estas en el tema de APORTE: scroll facil con jquery (= focus) en el foro de Jquery en Foros del Web. Para hacer un scroll animado a cualquier elemento de una pagina, y focalizarlo, a la manera en que funcionan las anclas en html, podemos hacer ...
  #1 (permalink)  
Antiguo 02/05/2010, 14:21
Avatar de mayid
Colaborador
 
Fecha de Ingreso: marzo-2009
Ubicación: BsAs
Mensajes: 4.014
Antigüedad: 15 años, 7 meses
Puntos: 101
APORTE: scroll facil con jquery (= focus)

Para hacer un scroll animado a cualquier elemento de una pagina, y focalizarlo, a la manera en que funcionan las anclas en html, podemos hacer así:
Cita:
// focalizar
var focalizar = $("div#destino").position().top;
$('html,body').animate({scrollTop: focalizar}, 1000);
Con esto, estaremos haciendo scroll hacia el div#destino.

Esto:
$('html,body')

asegura que sea crossbrowser, pero pueden intentar lo mismo con:
$(document)
  #2 (permalink)  
Antiguo 03/05/2010, 11:38
 
Fecha de Ingreso: mayo-2010
Mensajes: 25
Antigüedad: 14 años, 6 meses
Puntos: 1
Respuesta: APORTE: scroll facil con jquery (= focus)

Código:
jQuery.fn.scrollTo = function(time){
  var t = $(this).offset().top;
  if(t > 10){t = t - 10}
  if(time == 'fast'){time = 400}
  if(time == 'medium'){time = 800}
  if(time == 'slow'){time = 1200}
  if(time == null){time = 1000}
  $('html,body').animate({scrollTop: t}, time);
}
con esa funcion que cree podes poner directamente el id del objeto que quieras llegar, ejemplo:

Código:
$('#menu').scrollTo('fast')

Etiquetas: facil, focus, scroll, aportes
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 15:27.