CODEWITHSUNDEEP
jqueryjquery-ui
marcelo2605
marcelo2605

Reputation: 2794

jQuery UI show() effect is not expected

I'm trying to reproduce on show() the same scale effect run on hide(). I'm using the same parameters, but the effect is not the same:

$('.div1').show('scale', {
   direction: "horizontal",
   duration: 1000
});

$('.div2').hide('scale', {
   direction: "horizontal",
   duration: 1000
});

http://jsfiddle.net/AUM6d/305/

Upvotes: 6

Views: 93

Answers (2)

Omri Aharon
Omri Aharon

Reputation: 17064

You can use the from attribute and achieve what you wanted:

$('.div1').show('scale', {
        direction: "horizontal" ,
        from: { width: "0"}
       },
    1000
);

That way you tell it to start from 0 width and expand from there.

Fiddle

Upvotes: 4

Surreal Dreams
Surreal Dreams

Reputation: 26380

If the effect is acceptable, try this:

$('.div1').show('scale', {
   direction: "both",
   duration: 1000
});

$('.div2').hide('scale', {
   direction: "both",
   duration: 1000
});

JSFiddle: http://jsfiddle.net/AUM6d/307/

It's slightly different, but it works. From my testing (and the jQueryUI demo page) it looks like direction: 'horizontal' is buggy.

Upvotes: 1

Related Questions