2009-11-04 18 views
11

¿Cómo se puede utilizar la función slideDown() con suavizado?jQuery slideDown con easing

¿Quizás lo extienda de alguna manera?

Busco algo como esto:

jQuery.fn.slideDown = function(speed, easing, callback) { 
    return ... 
}; 

, así que puede usarlo deslice este

$('.class').slideDown('400','easeInQuad'); 

o esta

$('.class').slideDown('400','easeInQuad',function(){ 
    //callback 
}); 

Respuesta

24

Tome un vistazo a este página, que contiene muchas funciones de relajación: http://gsgd.co.uk/sandbox/jquery/easing/

Usando ese plugin que puede hacer cosas como:

$(element).slideUp({ 
    duration: 1000, 
    easing: method, 
    complete: callback}); 
13

Usted puede utilizar el método animado con jQueryUI y la easing effects así:

$(".demo").animate({height: "hide"}, 1500, "easeInQuad", function(){}); 
+2

Esto funcionó perfectamente para mí - no hay necesidad de otro plugin. Gracias. –

+0

El enlace está roto. – Flux

4

Aliviar de entrada y salida:

  $("#SignIn").click(function() { 

       $(".divSlideTop").slideDown({ 
        duration: 1000, 
        easing: "easeInQuad" 
       }); 
      }); 

      $("#close").click(function() { 

       $(".divSlideTop").slideUp({ 
        duration: 1000, 
        easing: "easeOutQuad" 
       }); 
      }); 
0
$('.class').slideDown(400,'easeInQuad'); 

Quo tes no necesita numérico

-1

Tenga una mirada en mi pluma Demo que sencillo de utilizar $(element).slideUp({duration:1000});

Cuestiones relacionadas