jQuery Isotope Possible Chrome Bug?
Asked Answered
L

1

7

I'm using jQuery Isotope to fill in the spaces on a multi-width multi-height grid (equal proportions).

The grid is sorted using ui-sortable with a button to toggle back to Isotope after sorting. There are some sort orders that leave empty blocks. How can I use Isotope to fill in the spaces?

I've experimented with multiple Isotope layout methods.

See http://jsfiddle.net/zdSYG/41/

$(document).ready(function() {

var $itemList = $('#sortable');

    $itemList.isotope({
    resizesContainer: false,
    masonry: {
        rowHeight: 250,
        columnWidth: 325
    }
});

$('#wp-admin-bar-edit').click(function() {
    $itemList.isotope('destroy');

    $itemList.sortable({

        //Do Ajax Stuff with UI-Sort Order
    });

});
});
//Toggle back to Isotope after jQuery UI-Sortable Ajax stuff
$(document).ready(function() {
$('#wp-admin-bar-sort').click(function() {
    $('#sortable').isotope({
        resizesContainer: false,
        masonry: {
            rowHeight: 250,
            columnWidth: 325

        }
    });
});
});

Udate:

The desired affect is achieved in Firefox 4, and IE 8 & 9 but the issue seems to be with Google Chrome (Latest version stable channel).

Chrome:

enter image description here

Firefox 4:

enter image description here

Location answered 3/6, 2011 at 22:27 Comment(2)
Chrome throws an error here Line 4: $itemList.isotope({...}); Error : Object [object Object] has no method 'isotope'Iey
Actually, this seems to be caused by GET http://c3mdigital.com/pub/jquery.isotope.js 404 (Not Found)Iey
B
1

i found it was when i was using an earlier version of jquery, 1.4.1 in my case. I moved to 1.7.1 and it's all working fine now.

Brandt answered 1/4, 2012 at 9:54 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.