jQuery matchHeight maintainScroll not working

Question

I've been using jQuery matchHeight for a few elements on my site. I can trigger an update if needed by firing:

$.fn.matchHeight._update();

My problem is that I loose scroll position. There is $.fn.matchHeight._maintainScroll = true; which I have set at the top of the function where I'm calling matchHeight into play. And hooked into my Slider onChange function I've got an update, like so;

$('#reviews-slider').owlCarousel({
        loop: true,
        margin: 0,
        nav: false,
        lazyLoad : true,
        items: 1,
        dots: true,
        autoHeight:true,
        itemElement: 'blockquote',
        dotsSpeed: 400,
        autoplay: false,
        onChanged : function () {
            $.fn.matchHeight._update();
        }
    });

Does anyone kno what I'm doing wrong and why my maintain scroll doesn't seem to be working. Can it be called in along with _update? I did try putting it within the change function, however this still didn't work.

The reason I'm looking to use maintain scroll is due to the fact when I trigger an update, the content can be considerably longer and cause a jump in page position. There is a note at the bottom of the git page for this, however I can't seem to get it working.

score 1 · Answer 1 · answered Aug 15 '17 at 21:22

Had the same problem after an ajax call my page jumped up. The option _maintainScrollPosition seems to be taken into account but $(window).scrollTop() is always 0 in webkit browsers due to a bug or "featured bug".

The library code that causes this issue:

// take note of scroll position
var scrollTop = $(window).scrollTop(), // seems to be 0 most of the time 

// ***

// restore scroll position if enabled
if (matchHeight._maintainScroll) {
    $(window).scrollTop((scrollTop / htmlHeight) * $('html').outerHeight(true));
}

We all know how multiplying by 0 looks like.

The solution

Unfortunately it's a drastic CSS change where you would remove height: 100% from the html and body tag. Also overflow: hidden on the body will fail when you're dealing with overflow containers for example.

jQuery matchHeight maintainScroll not working

1 Answers1