Question

I have a div with height 40px; I’d like to do a scrollDown with jQuery from this height to 600px.

How can I do it?

Answer 1

You’re looking for animate rather than scrollDown (or slideDown, which I suspect is what you meant). E.g.:

$("selector_for_the_div").animate({
    height: 600
});

Live example

---

Update: In a comment on another answer you said:

Uhm, I think I can’t use animate! Because I Need that every elements linked to this div (like some div with position absolute) scroll with #myDiv

If you have elements aligned with the div in a way that they don’t get moved naturally when the div gets taller (e.g., you’ve used position: absolute or similar), you can animate their top (or bottom) property at the same time. I’d look at whether it was possible to relate them to the div in a different way, but if you can’t, that would be pretty much your only option. It looks something like this:

jQuery(function($) {
  var theDiv = $("#theDiv"),
      absDiv = $("#absDiv"),
      coords = theDiv.offset(),
      origHeight = theDiv.height();

  absDiv.css({
    position: "absolute",
    left:     coords.left + "px",
    top:      (coords.top + origHeight) + "px"
  });

  $("#theButton").click(function() {
    var height = theDiv.height();
    if (height < 600) {
      theDiv.animate({
        height: 600
      });
      absDiv.animate({
        top: coords.top + 600
      });
    }
  });
});

Live example