Question

我正在使用radiantscroller和quicksand过滤器，事情开始解决。项目正在过滤但是我在寻找一种在行内放置元素的方法时遇到了问题...

示例。我的HTML标记是：

<div id="myScroller">
<div class="scroller-el">
<a class="item1">image</a>
</div>
</div>

但是辐射状滚动器在#myScroller和.scroller-el之间添加了一个类为.radiant_scroller_row的div，该行将显示我放入辐射状滚动器脚本中的许多项目：

$(document).ready(function() {
var sc = $('#myScroller').radiantScroller({
elementWidth: 380,
cols: 3,
rows: 3,
elementMargin: 0, 
addPagination: true
});
});

我用于过滤的代码是此代码，但单击时它会删除.radiant_scroller_row

$(window).load(function() {
var $data = $("#myScroller").clone();
$('.portfolio-filter li a').click(function(e) {
    $('.portfolio-filter li a').removeClass("active");   

    var filterClass=$(this).attr('class') //.split(' ').slice(-1)[0];
    filterClass = filterClass ? filterClass.split(' ')[0] : '';
    if (filterClass == 'all') {
        var $filteredData = $data.find('div[class|="radiant_scroller_row"] div[class|="scroller-el"] a');
    } else {
        var $filteredData = $data.find('a.' + filterClass);
    }
    $("#myScroller").quicksand($filteredData, {
        duration: 800,
        adjustHeight: 'dynamic' 

                });     
    $(this).addClass("active");             
    return false;
});

});

是否可以修改其中一个片段以实际显示行？还是Radiant Scroller的替代品，可以给我一张图像网格的幻灯片？这与过滤器配合使用不是很好（还尝试了同位素，即使确实出现了行，但流沙或同位素的分页始终是错误的-它会从第一次加载中获取项目数，因此在过滤时会显示空白页。

谢谢！

筛选网格幻灯片中的项目

0 个答案: