使用切换和同位素时更改css“活动”链接

Question

我有一个关于我的this page的问题。菜单和子菜单已切换，我正在使用同位素。我想知道是否可以改变刚刚点击的链接的风格。由于这一切都发生在一个页面中，所以针对此问题的其他解决方案不起作用。

我不能让this工作，可能是因为我必须使用多个切换。 （+我的电视日程安排页面增加了复杂性，因为它基本上是一个开关内的整个页面。）

我希望有人可以通过查看我的源代码来帮助我。

Answer 1

为您的活动样式创建一个css类，而不是当前在“电视节目表”（background：teal; color：white）上的内联样式。例如，称这个类为“active”。

只需在您已经使用jquery设置的点击处理程序中添加和删除此类。因此，在您的源代码中的第134行：

$('.sort a').click(function(){ 

    //add these 2 lines 
    $('.sort a').removeClass('active'); 
    $(this).addClass('active'); 

    //the rest of your handler 
    var selector = $(this).attr('data-filter'); 
    $container.isotope({ 
    filter: selector, 
    animationOptions: { 
     duration: 750, 
     easing: 'linear', 
     queue: false, 
    } 
    }); 
    return false; 
}); 

第一行会经过并将其从该块中的所有标记中移除（如果存在）。下一个将它添加到被点击的那个。

这通常是我做这种事情的方式。它独立于同位素 - 只使用你已经拥有的jquery。