JQuery animate to scroll to top of div

Question

I have a hidden div, .model-detail-panel that is revealed when clicking .span.

$('[class*="span"]').on('click', function () {
        $(this).parent().next('.model-detail-panel').slideToggle()
    });

I want to incorporate .animate() into this code to scroll the screen so that the top of the revealed div is at the top of the window.

How can I achieve this?

Thanks in advance..

Answer 1

You can use Position, like this:

$("body, html").animate({
    scrollTop: $(".model-detail-panel").position().top
});

Answer 2

Slightly changing the code suggested by @michele-bertoli to

$('html, body').animate({scrollTop: $(".model-detail-panel").offset().top
            }, 500);

Has worked for me..

Thanks to those who posted..