DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> js帶索引和左右箭頭圖片輪播
js帶索引和左右箭頭圖片輪播
編輯:關於JavaScript     
查看效果:http:///keleyi/phtml/image/15.htm


<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<title>帶索引和左右箭頭圖片輪播 - </title><base target="_blank" />
<style type="text/css">
body { background: #ecfaff; }
</style>
<link href="http:///keleyi/phtml/image/15/KeleyiEffcet.css" type="text/css" rel="Stylesheet" />
</head>
<body>
<div style="width:500px;margin:0px auto;"><h2>帶索引和左右箭頭圖片輪播</h2>
<a href="http:///a/bjac/v6c7x9fq.htm" target="_blank">原文</a>
</div>
<div style="width:500px;margin:0px auto;">
<div class="box-keleyi-com" id="slider-keleyi-com">
<ul>
<li><a href="http:///a/bjac/cu727al8.htm"><img src="http://down./images/bing/2013-8-10_Toulouse_ZH-CN7808794431_keleyi.jpg" title="多彩圖標按鈕動畫下拉菜單" /></a></li>
<li><a href="http:///a/bjac/0ttmf3ib.htm"><img src="http://down./images/bing/2013-9-27_BoliviaSalt_ZH-CN10259156901_keleyi.jpg" title="jQuery焦點新聞圖片輪播" /></a></li>
<li><a href="http:///a/bjac/3pipmkmg.htm"><img src="http://down./images/bing/2013-8-22_KataleKhorCave_ZH-CN6707191757_keleyi.jpg" title="HTML5煙花特效" /></a></li>
<li><a href="http:///a/bjac/600xsi0s.htm"><img src="http:///keleyi/phtml/picnext/images/k05.jpg" title="javascript俄羅斯方塊游戲" /></a></li>
<li><a href="http:///a/bjac/s3sw6q5t.htm"><img src="http:///keleyi/phtml/picqiehuan/p3.jpg" title="圖片輪播匯總" /></a></li>
</ul>
</div>
</div>
<script src="http:///keleyi/phtml/image/15/keleyieffect.js"></script>
<script type="text/javascript">
Effect.slider({
'targetElement': 'slider-ke'+'leyi-com',
'showMarkers': true,
'showControls': true
});
</script>

</body>
</html>


圖片輪播切換匯總
XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved