html5幻燈片圖片傾斜層疊切換效果代碼



114 453 152



特效描述:html5幻燈片圖片 傾斜層疊切換,html5幻燈片圖片傾斜層疊切換

代碼結構

1. 引入CSS

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

2. 引入JS

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

3. HTML代碼

<div id="tour" class="zebra">
	<div class="wrap">
		<div class="switcher-wrap slider">
			<a class="prev jQ_sliderPrev" href=""></a>
			<a class="next jQ_sliderNext" href=""></a>
			<ul id="img-slider" style="height: 450px;">
				<li class="img">
					<img src="images/client.png" />
					<div class="label">Client</div>
				</li>
				<li class="img">
					<img src="images/developer.png" />
					<div class="label">Developer</div>
				</li>
				<li class="img">
					<img src="images/manager.png" />
					<div class="label">Manager</div>
				</li>
				<li class="img">
					<img src="images/tester.png" />
					<div class="label">Tester</div>
				</li>
				<li class="img">
					<img src="images/user.png" />
					<div class="label">Power User</div>
				</li>
			</ul>
			<ul class="switcher jQ_sliderSwitch">
				<li class="active"><a href=""></a></li>
				<li><a href=""></a></li>
				<li><a href=""></a></li>
				<li><a href=""></a></li>
				<li><a href=""></a></li>
			</ul>
		</div>
	</div>
</div>



用戶評論
大牛,別默默的看了,快登錄幫我點評一下吧!:)      登錄 | 注冊


熱門標簽: 滾動切換 滾動條切換 滑動選項卡 滑動切換 疊加浮動層 選項卡切換 選項卡 切換 tab切換 頁面切換 選項卡插件 切換插件 滑動手風琴 層疊疊加 疊加層疊 層疊 疊加 加載更多 旋轉翻轉 旋轉 翻轉 圖片疊加 圖片層疊 圖片翻轉 圖片旋轉 圖片切換 圖片選項卡 圖標選項卡 選項卡自動切換
?
×
×

注冊

官方QQ群

掃描上面二維碼加微信群

官方QQ群

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

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

老夫子电子