я попытался адаптировать объяснение из этого поста:
в моем собственном случае:
http://40parallele.com/produits-test.php?id=4
но чего-то не хватает …
Вот мой код JS:
// Isotope
$j(window).load(function()
{
// lazyload
var $win = $(window);
var $imgs = $('img.lazy');
var $container = $j('#folio');
// calcul la taille des images
$imgs.each(function(index) {
var item_height = $(this).attr("height");
$(this).parent().parent().css("height",item_height);
});if( $container.length )
{
$container.isotope(
{
itemSelector : '.folio-item'
});
var $optionSets = $j('#portfolio .folio-filter'),
$optionLinks = $optionSets.find('a');
$optionLinks.click(function()
{
var $this = $j(this);
// don't proceed if already selected
if ( $this.hasClass('selected') )
{
return false;
}
var $optionSet = $this.parents('.folio-filter');
$optionSet.find('.selected').removeClass('selected');
$this.addClass('selected');
// make option object dynamically, i.e. { filter: '.my-filter-class' }
var options = {},
key = $optionSet.attr('data-option-key'),
value = $this.attr('data-option-value');
// parse 'false' as false boolean
value = value === 'false' ? false : value;
options[ key ] = value;
if ( key === 'layoutMode' && typeof changeLayoutMode === 'function' )
{
changeLayoutMode( $this, options );
} else {
// otherwise, apply new options
$container.isotope( options );
}
return false;
});
}
$container.isotope({
onLayout: function() {
$win.trigger("scroll");
}
});
/*OK*/
$imgs.lazyload({
failure_limit: Math.max($imgs.length - 1, 0)
});
});
$j(window).bind('resize', function(e)
{
window.RT = setTimeout(function() {$j('#folio').isotope('reLayout'); }, 800);
});
Спасибо за вашу помощь
Задача ещё не решена.
Других решений пока нет …