jquery鼠標導航下滑顯示圖片列表效果



101 403 135



特效描述:導航下滑 顯示圖片列表,

代碼結構

1. 引入JS

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

2. HTML代碼

<div class="nav">
	<ul>
		<li class="b"><a href="http://www.dijiuzhanzhang.com/" class="a">首頁</a></li>
		<li class="b">
			<a href="http://www.dijiuzhanzhang.com/" class="a">產品展示</a>
			<div class="xmzs0">
				<div class="xm1">
					<p><a href="http://www.dijiuzhanzhang.com/"><img src="lh1.jpg" width="167" height="117" /></a></p>
					<h3>小米手機</h3>
					<span>鼠標導航下滑效果</span>
				</div>
				<div class="xm1" style="margin-left:12px">
					<p><a href="http://www.dijiuzhanzhang.com/"><img src="lh1.jpg" width="167" height="117" /></a></p>
					<h3>小米手機</h3>
					<span>鼠標導航下滑效果</span>
				</div>
				<div class="xm1" style=" margin-left:12px">
					<p><a href="http://www.dijiuzhanzhang.com/"><img src="lh1.jpg" width="167" height="117" /></a></p>
					<h3>小米手機</h3>
					<span>鼠標導航下滑效果</span>
				</div>
				<div class="xm1" style=" margin-left:12px">
					<p><a href="http://www.dijiuzhanzhang.com/"><img src="lh1.jpg" width="167" height="117" /></a></p>
					<h3>小米手機</h3>
					<span>鼠標導航下滑效果</span>
				</div>
			</div>
		</li>
		<li class="b"><a href="http://www.dijiuzhanzhang.com/" class="a">新聞中心</a></li>
		<li class="b"><a href="http://www.dijiuzhanzhang.com/" class="a">企業文化</a></li>
		<li class="b"><a href="http://www.dijiuzhanzhang.com/" class="a">人才理念</a></li>
		<li class="b"><a href="http://www.dijiuzhanzhang.com/" class="a">聯系我們</a></li>
	</ul>
</div>



用戶評論
大牛,別默默的看了,快登錄幫我點評一下吧!:)      登錄 | 注冊
admin
關注
TA的相關作品 >>更多
熱搜關鍵詞
熱門下載


熱門標簽:
?
×
×

注冊

官方QQ群

掃描上面二維碼加微信群

官方QQ群

jQuery/js討論群
群號:642649996
Css3+Html5討論群
群號:322131262

加群請備注:從官網了解到

老夫子电子