jquery分類(lèi)菜單列表篩選插件

使用方法：

1、head引入css文件

<link href="css/style.css" rel="stylesheet" type="text/css"/>

2、head引入js文件

<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/current.js"></script>

3、body引入HTML代碼

<div class="cation-content">
	<div class="cation-middle">
		<dl class="cation-list">
			<dt>分類(lèi)</dt>
			<dd>
				<a href="#" rel="" name="mode" class="all on">全部</a>
				<a href="#" rel="服裝鞋包" name="mode" class="default">服裝鞋包</a>
				<a href="#" rel="家電數(shù)碼" name="mode" class="default">家電數(shù)碼</a>
				<a href="#" rel="英文外貿(mào)" name="mode" class="default">英文外貿(mào)</a>
				<a href="#" rel="綜合通用" name="mode" class="default">綜合通用</a>
				<a href="#" rel="食品保健" name="mode" class="default">食品保健</a>
				<a href="#" rel="團(tuán)購(gòu)模板" name="mode" class="default">團(tuán)購(gòu)模板</a>
				<a href="#" rel="美容護(hù)膚" name="mode" class="default">美容護(hù)膚</a>
				<a href="#" rel="珠寶飾品" name="mode" class="default">珠寶飾品</a>
				<a href="#" rel="鮮花禮品" name="mode" class="default">鮮花禮品</a>
				<a href="#" rel="童裝母嬰" name="mode" class="default">童裝母嬰</a>
			</dd>
		</dl>
		<dl class="cation-list">
			<dt>主題</dt>
			<dd>
				<a href="#" rel="" name="theme" class="all on">全部</a>
				<a href="#" rel="古典雅致" name="theme" class="default">古典雅致</a>
				<a href="#" rel="可愛(ài)溫馨" name="theme" class="default">可愛(ài)溫馨</a>
				<a href="#" rel="時(shí)尚簡(jiǎn)約" name="theme" class="default">時(shí)尚簡(jiǎn)約</a>
				<a href="#" rel="潮流酷炫" name="theme" class="default">潮流酷炫</a>
				<a href="#" rel="節(jié)日慶典" name="theme" class="default">節(jié)日慶典</a>
			</dd>
		</dl>
		<dl class="cation-list">
			<dt>色系</dt>
			<dd>
				<a href="#" rel="" name="system" class="all on">全部</a>
				<a href="#" rel="多彩" name="system" class="default">多彩</a>
				<a href="#" rel="橙色" name="system" class="default">橙色</a>
				<a href="#" rel="粉色" name="system" class="default">粉色</a>
				<a href="#" rel="紅色" name="system" class="default">紅色</a>
				<a href="#" rel="綠色" name="system" class="default">綠色</a>
				<a href="#" rel="藍(lán)色" name="system" class="default">藍(lán)色</a>
				<a href="#" rel="黑色" name="system" class="default">黑色</a>
			</dd>
		</dl>
		<dl class="cation-list">
			<dt>價(jià)格</dt>
			<dd>
				<a href="#" rel="" name="price" class="all on">全部</a>
				<a href="#" rel="2000 - 6000" name="price" class="default">2000 - 6000</a>
				<a href="#" rel="6000 - 10000" name="price" class="default">6000 - 10000 </a>
				<a href="#" rel="10000 - 14000" name="price" class="default">10000 - 14000 </a>
				<a href="#" rel="18000 - 22000" name="price" class="default">18000 - 22000</a>
				<a href="#" rel="26000 - 30000" name="price" class="default">26000 - 30000</a>
			</dd>
		</dl>
	</div>
</div>


<script type="text/javascript">
	$(function(){
		new SelectTag({
			child : ".default", //所有默認(rèn)
			over : 'on', //當(dāng)前選中
			all : ".all" // 默認(rèn)全部
		});
	})
</script>