CODEWITHSUNDEEP
jquery
Lucas_Santos
Lucas_Santos

Reputation: 4740

SlideDown or SlideUp effect to set Height

How can I do a slideDown() or slideUp() effect but I don't want close my div, I want just set the height but doing the slideDown() or slideUp() effect.

Example

<div id="modalNovoTicket" style="height: 600px;"></div>

$("#modalNovoTicket").slideUp("slow", function () {
    $(this).css("height", "400px");
});

Problem

With this code, my div close

Upvotes: 0

Views: 1772

Answers (6)

Codegiant
Codegiant

Reputation: 2150

You can try .animate() method and for delay use 600 for slow speed, 400 for medium speed and 200 for fast speed. Here the delay time will be measured in milliseconds. 

 $("#modalNovoTicket").animate({
        height: "400px"
    }, 600);

Upvotes: 0

zxqx
zxqx

Reputation: 5205

Use animate() instead:

$("#modalNovoTicket").animate({
  height: "400px"
});

See DEMO.

You can also specify an animation speed by integer (in milliseconds) or string ("slow", "fast"):

$("#modalNovoTicket").animate({
  height: "400px"
}, 500);

And a block of code to execute once the animation is complete:

$("#modalNovoTicket").animate({
  height: "400px"
}, 500, function() {
  alert("Animation complete!");
});

Upvotes: -1

Christian Ezeani
Christian Ezeani

Reputation: 350

I think this is what you want:

$("#modalNovoTicket").animate({
    'height': '500px'
}, 500);

Upvotes: 3

darshanags
darshanags

Reputation: 2519

Use animate:

$("#modalNovoTicket").animate({height:400},"slow");

Upvotes: 1

Undefined
Undefined

Reputation: 11431

You are looking for the animate() method.

try this code

$("#modalNovoTicket").animate({
    height: 400
}, 600)

Upvotes: 0

SLaks
SLaks

Reputation: 887469

You're looking for the animate() method.

$(...).animate({ height: 400 }, "slow");

Upvotes: 1

Related Questions