我不知道怎么会这样做,所以我想在这里问。
我正在尝试将Isotope用于身体部位说明,但我在页面上有许多过滤器选项。下面是代码:
<ul id="options" class="combo-filters ">
<li class="level-1 parent-active first">
<a href="/instructions/">Body Part</a>
<div class="option-combo bodypart">
<ul class="filter option-set clearfix " data-filter-group="bodypart">
<li><a href="#filter-bodypart-all" data-filter-value="" class="selected">all</a></li>
<li><a href="#filter-bodypart-chest" data-filter-value=".chest">Chest</a></li>
<li><a href="#filter-bodypart-legs" data-filter-value=".legs">Legs</a></li>
<li><a href="#filter-bodypart-back" data-filter-value=".back">Back</a></li>
<li><a href="#filter-bodypart-shoulders" data-filter-value=".shoulders">Shoulders</a></li>
<li><a href="#filter-bodypart-arms" data-filter-value=".arms">Arms</a></li>
</ul>
</div>
<div class="option-combo goal">
<a href="/instructions/">Goal</a>
<ul class="filter option-set clearfix " data-filter-group="goal">
<li><a href="#filter-goal-all" data-filter-value="" class="selected">all</a></li>
<li><a href="#filter-goal-mass" data-filter-value=".mass">mass</a></li>
<li><a href="#filter-goal-shaping" data-filter-value=".shaping">shaping</a></li>
</ul>
</div>
<div class="option-combo focusarea">
<a href="/instructions/">Chest</a>
<ul class="filter option-set clearfix " data-filter-group="focusarea">
<li><a href="#filter-focusarea-all" data-filter-value="" class="selected">all</a></li>
<!-- Chest -->
<li><a href="#filter-focusarea-upper" data-filter-value=".upper">upper</a></li>
<li><a href="#filter-focusarea-middle" data-filter-value=".middle">middle</a></li>
<li><a href="#filter-focusarea-lower" data-filter-value=".lower">lower</a></li>
</ul>
<a href="/instructions/">Back</a>
<ul class="filter option-set clearfix " data-filter-group="focusarea">
<li><a href="#filter-focusarea-all" data-filter-value="" class="selected">all</a></li>
<!-- Back -->
<li><a href="#filter-focusarea-width" data-filter-value=".width">width</a></li>
<li><a href="#filter-focusarea-thickness" data-filter-value=".thickness">thickness</a></li>
<li><a href="#filter-focusarea-lowerback" data-filter-value=".lowerback">lower back</a></li>
</ul>
<a href="/instructions/">Shoulders</a>
<ul class="filter option-set clearfix " data-filter-group="focusarea">
<li><a href="#filter-focusarea-all" data-filter-value="" class="selected">all</a></li>
<!-- Shoulders -->
<li><a href="#filter-focusarea-sidedelt" data-filter-value=".sidedelt">side delt</a></li>
<li><a href="#filter-focusarea-rearposteriordelt" data-filter-value=".rearposteriordelt">rear posterior delt</a></li>
<li><a href="#filter-focusarea-traps" data-filter-value=".traps">traps</a></li>
<li><a href="#filter-focusarea-allshoulderheads" data-filter-value=".allshoulderheads">all shoulder heads</a></li>
<li><a href="#filter-focusarea-anteriorfrontdelt" data-filter-value=".anteriorfrontdelt">anterior front delt</a></li>
</ul>
<a href="/instructions/">Legs</a>
<ul class="filter option-set clearfix " data-filter-group="focusarea">
<li><a href="#filter-focusarea-all" data-filter-value="" class="selected">all</a></li>
<!-- Legs -->
<li><a href="#filter-focusarea-glutes" data-filter-value=".glutes">glutes</a></li>
<li><a href="#filter-focusarea-calves" data-filter-value=".calves">calves</a></li>
<li><a href="#filter-focusarea-thighs" data-filter-value=".thighs">thighs</a></li>
<li><a href="#filter-focusarea-hamstrings" data-filter-value=".hamstrings">hamstrings</a></li>
<li><a href="#filter-focusarea-quads" data-filter-value=".quads">quads</a></li>
</ul>
<a href="/instructions/">Arms</a>
<ul class="filter option-set clearfix " data-filter-group="focusarea">
<li><a href="#filter-focusarea-all" data-filter-value="" class="selected">all</a></li>
<!-- Arms -->
<li><a href="#filter-focusarea-biceps" data-filter-value=".biceps">biceps</a></li>
<li><a href="#filter-focusarea-triceps" data-filter-value=".triceps">triceps</a></li>
<li><a href="#filter-focusarea-forearms" data-filter-value=".forearms">forearms</a></li>
</ul>
</div>
</li>
</ul>
我要做的只是显示“身体部位”和“目标”,如果选择了身体部位下的“胸部”,它将在“胸部”焦点区域淡入,加载“全部,上部,中,下“选项。
最好的办法是什么?