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.
$(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
}
});
});
});
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).
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.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With