jCarousel là một plugin của Jquery dùng để tạo image slide cho trang web. Hướng dẫn 1 Tải jCarousel pulugin tại địa chỉ http://sorgalla.com/...
jCarousel là một plugin của Jquery dùng để tạo image slide cho trang web.
Hướng dẫn
- 1Tải jCarousel pulugin tại địa chỉ http://sorgalla.com/projects/download-zip.php?jcarousel
- 2Giải nén tập tin vừa tải, copy 2 thư mục lib(chứa thư viện javascript) và skins(chứa các giao diện cho slide) vào thư mục web của bạn.
- 3Đặt đoạn mã sau vào thẻ <head> của trang web để load các thư viện javascript và css
<!--
jQuery library
-->
<script type="text/javascript" src="lib/jquery-1.4.2.min.js"></script>
<!--
jCarousel library
-->
<script type="text/javascript" src="lib/jquery.jcarousel.min.js"></script>
<!--
jCarousel skin stylesheet
-->
<link rel="stylesheet" type="text/css" href="skins/tango/skin.css" /> - 4Đặt đoạn mã sau vào thẻ <head> để khởi tạo jCarousel
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery('#mycarousel').jcarousel({
visible: 4
});
});
</script> - 5Đặt đoạn mã sau vào thẻ <body> tại vị trí muốn hiển thị slide
<ul id="mycarousel" class="jcarousel-skin-tango">
<li><img src="images/image1.jpg" width="75" height="75" alt="" /></li>
<li><img src="images/image2.jpg" width="75" height="75" alt="" /></li>
<li><img src="images/image3.jpg" width="75" height="75" alt="" /></li>
<li><img src="images/image4.jpg" width="75" height="75" alt="" /></li>
</ul> - 6Kết quả hiển thị slide trên trang web
No comments: