Banditolane
Usuario habitual
Usuario habitual

Buenas a todos!

La web con la que estoy ahora utiliza el plugin scrollTo de jQuery para desplazarse entre las secciones. Pero lo hace de forma brusca y poco atractiva visualmente hablando. Por lo que sé, se puede emplear otro plugin llamado easing, pero no sé más que eso, y en la web donde lo encontré no es que se explique muy bien como usarlo, al menos yo no he logrado implementar el scrollTo con él... Os pongo el código que uso actualmente y el que no me funciona:

/* ESTE SI ME FUNCIONA */
 $("#btn").click( function() {
     
     $.scrollTo( {top:0, left:0}, 2500);

 });

/* ESTE NO */
$("#btn1").click( function() {
    
     $.scrollTo( {top:0, left:0},{
        duration:2500,
        easing:method
     });

 }); 

Bueno, el que no funciona es que el que he sacado de la página del plugin easing. Os pongo un ejemplo de lo que quiero conseguir por si sirviera de ayuda:

http://www.bountybev.com/home.html

Esa es un poco la idea, que vaya de menos a más y que lo haga progresivamente y no a "saltos" como me lo hace a mi, para sacar el máximo partido del movimiento del scroll... Si alguien lo ha usado antes o sabe controlarlo que me eche un cable pls.

Muchas gracias y un saludo!

Avatar Image
Colega ;)
Colega ;)

Si te refieres a este plugin que te pongo, aqui tienes ejemplos:

http://demos.flesler.com/jquery/scrollTo/

Banditolane
Usuario habitual
Usuario habitual

Si, ahí teóricamente viene uno de los ejemplos que usa el easing, pero cuando intento usar el código no me funciona. Os pongo el código tal y como viene en la página del scrollTo y la adaptación que yo hago para mi código:

$(...).scrollTo( 'li:eq(15)', 2500, {easing:'elasout'} );

 /* ESTE ES MI CODIGO */

 $("#btn").click( function() { 
     
     $.scrollTo( {top:0,left:0}, 2500, {easing:'elasout'} );

 }); 

No hay manera, lo sigue haciendo malamente, pero bueno quizá tocando un poco las opciones de duracion y demás consiga hacer algo mas fino...

Gracias y un saludo!

Banditolane
Usuario habitual
Usuario habitual

Además, otra de las cosas que no logro es que se cuando haces clic a 2 o 3 seguidamente, va una a una por orden haciendo el scrollTo, mientras que lo ideal sería que, mientras realiza un desplazamiento, al hacer clic en otro botón éste se detenga y se dirija a la otra sección... Alguien sabe como hacer esto??

Avatar Image
Come y duerme en el foro
Come y duerme en el foro
$(function(){
    $("#btn").click(function(){
        $.scrollTo(0,2500,{easing:'elseout'});
    }); 
 });

para detener algo y hacer que otra accion se tome en jQuery tenemos la funcion stop()

Banditolane
Usuario habitual
Usuario habitual

Vale, muchas gracias. La parte del easing esta resuelta! Ahora lo que no consigo es introducir el .stop() para que se detenga al hacer scroll con el ratón o al pulsar sobre otro botón... Se me ocurre que quizá metiendo el scrollTo en una función y luego con setTimeout y clearTimeout a lo mejor se puede hacer, o algo parecido no? Se agradece cualquier idea: gracias!

Un Saludo!

Banditolane
Usuario habitual
Usuario habitual

Todo funcionando y perfecto. Muchas gracias por la ayuda amigos! Os pongo el código para las 2 cosas para aquellos que tengan la misma duda puedan verlo y adaptarlo:

 $('#btn').click( function() {
     
     var destination = 0;
     $("html,body").stop().animate({
     scrollTop: destination
     },5000, 'easeInOutCubic');
     return false;                    

 });

Con este código, y los plugins de jQuery scrollTo (http://plugins.jquery.com/project/ScrollTo) y easing (http://gsgd.co.uk/sandbox/jquery/easing/) y este código se hace un efecto scroll automatizado muy atractivo. en la variable "destination" ponemos el punto exacto al que queramos que se dirija el srcoll. Espero que os sea until

Gracias y un saludo!

ATENCIÓN: Este tema no tiene actividad desde hace más de 6 MESES,
te recomendamos abrir un nuevo tema en lugar de responder al actual
Opciones:
Ir al subforo:
Permisos:
TU NO PUEDES Escribir nuevos temas
TU NO PUEDES Responder a los temas
TU NO PUEDES Editar tus propios mensajes
TU NO PUEDES Borrar tus propios mensajes
Temas similares
No se han encontrado temas similares