i having issue isotope sorting on ie. works except sorting, in 1 horizontal line, see attachment below that.
so here code initialize isotope, few filtering stuff, animation items, , adding opacity , class item.
(function($) { window.onload = function() { // animation items $('.work .item').each(function(i) { var item = $(this); settimeout(function() { item.addclass('is-showing'); settimeout(function() { item.removeclass('hidden is-showing'); }, 700); }, 150 * (i + 1)); }); }; $.fn.hidereveal = function(options) { options = $.extend({ timeout: 1000, filter: '*', hiddenstyle: { opacity: 0.2 }, visiblestyle: { opacity: 1 }, }, options); var = this; that.each(function() { var $items = $(this).children(); var $visible = $items.filter(options.filter); var $hidden = $items.not(options.filter); // reveal visible $visible.animate(options.visiblestyle, options.timeout); $visible.addclass("visible-item"); // hide hidden $hidden.animate(options.hiddenstyle, options.timeout); $hidden.removeclass("visible-item"); if (options.filter == '*') { jquery('.visible-item').removeclass('visible-item'); } }); settimeout(function() { that.isotope({ getsortdata: { visible: function(elem) { return !$(elem).hasclass("visible-item"); } }, sortby: 'visible' }) that.isotope("updatesortdata"); that.isotope({ sortby: 'visible' }); }, options.timeout); }; $(function() { var $container = $('#isotope-list'); $container.imagesloaded( function(){ $container.isotope({ itemselector: '.item', layoutmode: 'masonry', sortascending: true }); }); // bind filter button click $('#filters').on('click', 'a', function() { var filtervalue = $(this).attr('data-filter'); $container.hidereveal({ filter: filtervalue, timeout: 500 }); }); // change is-checked class on buttons $('#filters').each(function(i, buttongroup) { var $buttongroup = $(buttongroup); $buttongroup.on('click', 'a', function() { $buttongroup.find('.selected').removeclass('selected'); $(this).addclass('selected'); }); }); });
you need http://imagesloaded.desandro.com/ same author,
good luck! :)
Comments
Post a Comment