DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> jQuery入門知識 >> JQuery特效代碼 >> jcarousellite.js 基於Jquery的圖片無縫滾動插件
jcarousellite.js 基於Jquery的圖片無縫滾動插件
編輯:JQuery特效代碼     
1.引入JS庫,jquery.js腳本和插件腳本jcarousellite.js。
代碼如下:
<script type="text/javascript" src="path/to/jquery.js"></script>
<script type="text/javascript" src="path/to/jcarousellite.js"></script>

2.需要被展現的HTML結構 div>ul>li>img ,結構比較清晰
代碼如下:
<div>
<ul>
<li><img src="1.jpg" alt="" width="100" height="100" ></li>
<li><img src="2.jpg" alt="" width="100" height="100" ></li>
<li><img src="3.jpg" alt="" width="100" height="100" ></li>
<li><img src="4.jpg" alt="" width="100" height="100" ></li>
</ul>
</div>

3.執行啟動腳本
代碼如下:
$(function() {
$(".default .jCarouselLite").jCarouselLite({
btnNext: ".default .next",
btnPrev: ".default .prev"
});
});

官方網站演示:http://demo.jb51.net/js/jcarousellite2/index.htm
打包演示下載:http://www.jb51.net/jiaoben/33787.html
XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved