jquery仿天猫首页分类导航菜单特效代码下载


jquery仿天猫首页分类导航菜单特效代码下载
jquery仿天猫首页分类导航菜单特效代码下载以及分类导航菜单等js/jquery网页特效代码下载。

1. 引入CSS

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

2. 引入JS

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

3. HTML代码

		<div class="containor">
			<div class="nav_left">
				<ul>
					<li data-id="1"> <span>美妆/个人护理</span></li>
					<li data-id="2"> <span>手机 /数码 /电脑办公</span></li>
					<li data-id="3"> <span>零食 /茶酒 /进口食品 </span></li>
					<li data-id="4"> <span>母婴玩具 </span></li>
					<li data-id="5"> <span>腕表 /眼镜 /珠宝饰品 </span></li>
					<li data-id="6"> <span>大家电 /生活电器 </span></li>
					<li data-id="7"> <span>厨具 /收纳 /宠物  </span></li>
					<li data-id="8"> <span>汽车 /配件 /用品  </span></li>
					<li data-id="9"> <span>生鲜水果  </span></li>
					<li data-id="10"> <span>家纺 /家饰 /鲜花   </span></li>
				</ul>
			</div>
			<div class="nav_right">
				<div class="sub hide" data-id="1">
					<dl>
						<dt><a >护肤品 <i> &gt;</i></a> </dt>
						<dd>
							<a>官方直售</a>
							<a>面膜</a>
							<a>护肤套装</a>
							<a>乳液面霜</a>
							<a>精华液</a>
							<a>官方直售</a>
							<a>面膜</a>
							<a>护肤套装</a>
							<a>乳液面霜</a>
							<a>精华液</a>
							<a>官方直售</a>
							<a>面膜</a>
							<a>护肤套装</a>
							<a>乳液面霜</a>
							<a>精华液</a>
						</dd>
					</dl>
						<dl>
						<dt><a >彩妆 <i> &gt;</i></a> </dt>
						<dd>
							<a>时尚彩妆</a>
							<a>香水</a>
							<a>气垫护肤</a>
							<a>BB霜</a>
							<a>口红</a>
							<a>隔离</a>
						<a>粉底</a>
							<a>粉饼</a>
						</dd>
					</dl>
						<dl>
						<dt><a >男士护肤 <i> &gt;</i></a> </dt>
						<dd>
							<a>洁面爽</a>
							<a>面膜</a>
							<a>护肤套装</a>
							<a>肤水乳液/面霜</a>
							<a>精华液</a>
							<a>眼部护理</a>
							<a>面膜</a>
							<a>唇部护理</a>
							<a>防晒</a>
							<a>精华液</a>
							<a>T区护理控油</a>
						</dd>
					</dl>
<dl>
						<dt><a >护肤品 <i> &gt;</i></a> </dt>
						<dd>
							<a>官方直售</a>
							<a>面膜</a>
							<a>护肤套装</a>
							<a>乳液面霜</a>
							<a>精华液</a>
							<a>官方直售</a>
							<a>面膜</a>
							<a>护肤套装</a>
							<a>乳液面霜</a>
							<a>精华液</a>
							<a>官方直售</a>
							<a>面膜</a>
							<a>护肤套装</a>
							<a>乳液面霜</a>
							<a>精华液</a>
						</dd>
					</dl>
						<dl>
						<dt><a >彩妆 <i> &gt;</i></a> </dt>
						<dd>
							<a>时尚彩妆</a>
							<a>香水</a>
							<a>气垫护肤</a>
							<a>BB霜</a>
							<a>口红</a>
							<a>隔离</a>
						<a>粉底</a>
							<a>粉饼</a>
						</dd>
					</dl>
						<dl>
						<dt><a >男士护肤 <i> &gt;</i></a> </dt>
						<dd>
							<a>洁面爽</a>
							<a>面膜</a>
							<a>护肤套装</a>
							<a>肤水乳液/面霜</a>
							<a>精华液</a>
							<a>眼部护理</a>
							<a>面膜</a>
							<a>唇部护理</a>
							<a>防晒</a>
							<a>精华液</a>
							<a>T区护理控油</a>
						</dd>
					</dl>
					<dl>
						<dt><a >男士护肤 <i> &gt;</i></a> </dt>
						<dd>
							<a>洁面爽</a>
							<a>面膜</a>
							<a>护肤套装</a>
							<a>肤水乳液/面霜</a>
							<a>精华液</a>
							<a>眼部护理</a>
							<a>面膜</a>
							<a>唇部护理</a>
							<a>防晒</a>
							<a>精华液</a>
							<a>T区护理控油</a>
						</dd>
					</dl>
				</div>
				<div class="sub hide" data-id="2">
					<dl>
						<dt><a >电脑办公 <i> &gt;</i></a> </dt>
						<dd>
							<a>官方直售</a>
							<a>面膜</a>
							<a>护肤套装</a>
							<a>乳液面霜</a>
							<a>精华液</a>
							<a>官方直售</a>
							<a>面膜</a>
							<a>护肤套装</a>
							<a>乳液面霜</a>
							<a>精华液</a>
							<a>官方直售</a>
							<a>面膜</a>
							<a>护肤套装</a>
							<a>乳液面霜</a>
							<a>精华液</a>
						</dd>
					</dl>
				</div>
				<div class="sub hide" data-id="3">
					<dl>
						<dt><a >进口食品 <i> &gt;</i></a> </dt>
						<dd>
							<a>官方直售</a>
							<a>饼干</a>
							<a>海苔</a>
							<a>火腿肠</a>
							<a>方便面</a>
							<a>果冻</a>
							<a>水果干</a>
							<a>坚果</a>
							<a>面包蛋糕</a>
							<a>华夫饼</a>
							<a>进口巧克力</a>
							<a>进口咖啡</a>
							<a>进口葡萄酒</a>
							<a>啤酒饮料</a>
						</dd>
					</dl>
				</div>
				<div class="sub hide" data-id="4">
					<dl>
						<dt><a >母婴玩具 <i> &gt;</i></a> </dt>
						<dd>
							<a>童装</a>
							<a>秋换新</a>
							<a>商场同款</a>
							<a>特价优惠</a>
							<a>秋衣秋裤</a>
							<a>外套</a>
							<a>羽绒服</a>
							<a>夹克</a>
							<a>连衣裙</a>
							<a>裤子</a>
						</dd>
					</dl>
				</div>
				<div class="sub hide" data-id="5">
					<dl>
						<dt><a >珠宝饰品 <i> &gt;</i></a> </dt>
						<dd>
							<a>官方直售</a>
							<a>面膜</a>
							<a>护肤套装</a>
							<a>乳液面霜</a>
							<a>精华液</a>
							<a>官方直售</a>
							<a>面膜</a>
							<a>护肤套装</a>
							<a>乳液面霜</a>
							<a>精华液</a>
							<a>官方直售</a>
							<a>面膜</a>
							<a>护肤套装</a>
							<a>乳液面霜</a>
							<a>精华液</a>
						</dd>
					</dl>
				</div>
				<div class="sub hide" data-id="6">
					<dl>
						<dt><a >生活电器 <i> &gt;</i></a> </dt>
						<dd>
							<a>官方直售</a>
							<a>生活电器</a>
							<a>生活电器</a>
							<a>吹风机</a>
							<a>精华液</a>
							<a>官方直售</a>
							<a>面膜</a>
							<a>护肤套装</a>
							<a>乳液面霜</a>
							<a>精华液</a>
							<a>官方直售</a>
							<a>面膜</a>
							<a>护肤套装</a>
							<a>乳液面霜</a>
							<a>精华液</a>
						</dd>
					</dl>
				</div>
				<div class="sub hide" data-id="7">
					<dl>
						<dt><a >厨具 <i> &gt;</i></a> </dt>
						<dd>
							<a>厨具</a>
							<a>厨具</a>
							<a>油烟机</a>
							<a>洗碗机</a>
							<a>电磁炉</a>
							<a>微波炉</a>
						</dd>
					</dl>
				</div>
				<div class="sub hide" data-id="8">
					<dl>
						<dt><a >汽车 <i> &gt;</i></a> </dt>
						<dd>
							<a>汽车</a>
							<a>汽车</a>
							<a>汽车</a>
							<a>汽车</a>
							<a>汽车</a>
							<a>汽车</a>
							<a>汽车</a>
							<a>汽车</a>
							<a>汽车</a>
							<a>汽车</a>
						</dd>
					</dl>
				</div>
				<div class="sub hide" data-id="9">
					<dl>
						<dt><a >生鲜水果 <i> &gt;</i></a> </dt>
						<dd>
							<a>火龙果</a>
							<a>苹果</a>
							<a>榴莲</a>
							<a>进口水果</a>
							<a>优惠活动</a>
							<a>雪梨</a>
							<a>山竹</a>
							<a>葡萄</a>
							<a>泰国芒果</a>
							<a>柚子</a>
							<a>马蹄</a>
							<a>橘子</a>
							<a>香蕉</a>
							<a>猕猴桃</a>
							<a>椰子</a>
						</dd>
					</dl>
				</div>
				<div class="sub hide" data-id="10">
					<dl>
						<dt><a >当季热卖 <i> &gt;</i></a> </dt>
						<dd>
							<a>定制窗帘</a>
							<a>抱枕</a>
							<a>被子</a>
							<a>两用坐垫</a>
							<a>国际家纺床品</a>
							<a>国际居家布艺</a>
							<a>国际家居饰品</a>
						</dd>
					</dl>
				</div>
			</div>
		</div>

相关推荐

发表评论

相关文章