I’ve been having issues trying to get Isotope to render properly.
I’ve tried a few different ways to get it to work, including using the imagesLoad function, to no avail.
You can view the page here: http://wpsanjose.com/#latest-posts
If you select “ALL”, you’ll see the proper margins appear which is what I’m after when it first pops up.
This is the code I’m using:
(function($) {
$(window).load(function() {
//Set the isotope area
var $container = $('#isotope-wrap');
//Set our items to be filtered and how to display
$container.isotope({
itemSelector: 'article',
masonry: {
columnWidth: 1
}
});
var $filterSets = $('.options'),
$filterLinks = $filterSets.find( 'a' );
$filterLinks.click(function() {
var $this = $(this);
// don't do anything if already selected
if ( $this.hasClass('selected') ) {
return false;
}
var $filterSet = $this.parents('.options');
$filterSet.find('.selected' ).removeClass('selected');
$this.toggleClass('selected');
})
// filter items when filter link is clicked
jQuery('#filters a').click(function(){
var selector = $(this).attr('data-filter');
$container.isotope({
filter: selector
});
return false;
})
});
$(".entry").hover(
function() {
$(".article-outer", this).stop().animate({top: '-1000px'},{queue: false, duration: 700});
},
function() {
$(".article-outer", this).stop().animate({top: '0px'},{queue: false, duration: 700});
});
})(jQuery);
any help would be greatly appreciated!