Jquery Isotope - Grid items shake or move around when scrolling - IE only

161 Views Asked by At

I have a problem where while viewing my jquery isotope grid in IE11 the grid items move around a little while scrolling down the page. You can view the page here: dhm.970design.com/portfolio/

My JS for isotope:

////////// Isotope
    var $grid = $('.iso-grid').isotope({
        itemSelector: '.grid-item',
        layoutMode : 'fitRows',
        percentPosition: true,
        onLayout: function() {
            $(window).trigger("scroll");
        },
        fitRows: {
            gutter: 0
        }
    });

    $window = $(window);

    $grid.isotope('layout');

    $window.scroll($.throttle( 250, function() {
        $grid.isotope('layout');
    }));

    //force refresh as stuff loads
    $window.load(function() {
        var cnt = 1;
        var intervalIDc = window.setInterval(function() {
            $grid.isotope('layout');
            cnt++;
            if (cnt > 10) {
                window.clearInterval(intervalIDc);
            }
        }, 150);
    });

My CSS:

.grid:after {
    content: '';
    display: block;
    clear: both;
}

.grid-item,
.grid-sizer {
    width: 100%;
}

.grid-item {
    float: left;
    height: 350px;
    margin-bottom: 4px;
    margin-right: -1px; // Fix for grid breaking on resize
}
0

There are 0 best solutions below