javascript - 类别/标签选择器

Question

尝试将投资组合库添加到我正在制作的自定义 wp 主题中。我已经筋疲力尽地试图寻找甚至可以修改一些的解决方案和插件。我认为我在寻找解决方案时遇到的一个问题是我不完全确定哪些搜索词可以帮助我找到与我想要实现的目标类似的东西。

截至目前，我的导航有以下 div

<div id="tags" role="navigation">
<p>
<a class="portrait" href="#portrait">Portrait</a> / 
<a class="landscape" href="#landscape">Landscape</a> / 
<a class="sports" href="#sports">Sports</a> / 
<a class="nature" href="#nature">Nature</a> / 
<a class="weddings" href="#weddings">Weddings</a> / 
<a class="active" href="#">All</a>
</p>
</div>

在我的导航下方是我的图片 div。我想做的是能够从图像导航中选择一个类别，并且只显示那些特别标记的图像。我不想要的是为所做的标记/选择打开一个新页面。我想让所选导航的图像重新组织或淡入/淡出。

我确定那里有一个脚本或插件与我正在寻找的类似。或者就如何最好地实现这一点提供一些指导/建议将不胜感激。

提前致谢。

Answer 1

Quicksand jquery 插件将为您完成:

http://razorjack.net/quicksand/

同位素插件:

http://isotope.metafizzy.co/

或者使用一些 css3:

http://tympanus.net/Tutorials/CSS3FilterFunctionality/