Question

Let’s say I have a button that slidetoggles a div under when I click the button. The div has a height higher than the screen so a vertical scroll bar becomes visible in the browser. When I display the div I want to scroll to the bottom of the page but cant get it to work. I tried something like:

$('#button').click(function() {
 $('#MyDiv').SlideToggle();
   if($(this).hasClass('open')) {
          $(html).animate({ scrollTop: $(document).height() }, "slow");
    }
});

I have loaded jquery and jquery.scrollto.

Any ideas?

What happens is that the div is toggled but no scrolling performed.

Answer 1

See: http://jsfiddle.net/C7zC6/3/

And:

$('a').click(function() {

  $('#mydiv').slideToggle('slow', function() {
       var height = $('#mydiv').height();
       if($(this).is(':visible')){
           $(window).scrollTo(height);
       }
  });

});