Question

我试图通过隐藏过滤器来使我的Isotope过滤器列表更加用户友好，直到选择了某些内容。

这是一个JSFiddle：http://jsfiddle.net/LxNXM/

我无法让Isotope在JSFIddle中工作，但希望我能得到所需的帮助。

在小提琴中，有一条粗绿线。除非选择“正文部分”，否则在该行下方是我想要隐藏的过滤器选项。

因此，如果隐藏绿线下方的过滤器，并且用户选择“身体部位”下的“胸部”，则“胸部”过滤器将淡入，然后用户可以选择“上”，“中”或“下”。

我没有在Isotope文档中看到过这个我怎么能这样做？

让它像这样工作：

在每个bodypart焦点过滤器列表周围添加了一个ID，例如：#cheffocus
为正文部分过滤器列表中的每个锚添加了一个id，例如：#chestclick

这是隐藏和显示内容的JavaScript：

$(document).ready(function() {

//Hiding Focus Areas
    $('#chestfocus, #backfocus, #shouldersfocus, #legsfocus, #armsfocus').hide();


//Display Chest Focus List
    $("#chestclick").click(function() {
        $("#backfocus, #shouldersfocus, #legsfocus, #armsfocus").fadeOut("300", function(){
            $("#chestfocus").fadeIn("500");
        });
    });

//Display Back Focus List
    $("#backclick").click(function() {
        $("#chestocus, #shouldersfocus, #legsfocus, #armsfocus").fadeOut("300", function(){
            $("#backfocus").fadeIn("500");
        });
    });

//Display Shoulder Focus List
    $("#shouldersclick").click(function() {
        $("#backfocus, #chestfocus, #legsfocus, #armsfocus").fadeOut("300", function(){
            $("#shouldersfocus").fadeIn("500");
        });
    });

//Display Legs Focus List
    $("#legsclick").click(function() {
        $("#backfocus, #shouldersfocus, #chestfocus, #armsfocus").fadeOut("300", function(){
            $("#legsfocus").fadeIn("500");
        });
    });

//Display Arms Focus List
    $("#armsclick").click(function() {
        $("#backfocus, #shouldersfocus, #legsfocus, #chestfocus").fadeOut("300", function(){
            $("#armsfocus").fadeIn("500");
        });
    });
});

切换之前有点闪烁列表，有没有办法让转换更顺畅？

同位素：选择过滤器时显示更多过滤器

0 个答案: