Search code examples
jqueryhtmlscroll

jQuery: Scroll to the center of the element

I am working on a jQuery function that scrolls to the div on click. Right now it will scroll to the top, I was wondering if their was a way to make it scroll to the center of $('.scrollit') instead of top, or possibly a way to offset it by some pixel amount?

$(".playbox").on('click', function () {
    $('.scrollit').animate({
        scrollTop: $(this).offset().top
    }, 1000);
Solution

  • You can use the height of the element.

    scrollTop: $(this).offset().top + $(this).height() / 2;

    Add the half of the height of the element to the scrollTop to scroll to the center of the element.