Feature List jQuery Plugin
Featured List là một plugin của jQuery cho phép bạn tạo các widget “Featured Items” một cách nhanh chóng. Plugin rất nhẹ (chỉ 2KB) và có thể sử dụng để thể hiện nhiều widget trên một trang web. Feature List jQuery Plugin hoạt động hầu hết trên các trình duyệt, bao gồm cả IE6.
Feature List yêu cầu mã HTML đơn giản và có thể dễ dàng đổi style bằng CSS. Bạn cũng có thể tùy chỉnh một số thuộc tính như: default tab, dừng khi di chuột qua, thời gian tự động thay đổi tab...
Cách sử dụng:
Trước tiên, bạn cần download jQuery và Featured List. Sau đó thêm vào trong thẻ <head> của trang web:
<!-- Thư viện jQuery --> <script type="text/javascript" src="js/jquery.min.js"></script> <!-- Featured List --> <script type="text/javascript" src="js/jquery.featureList-1.0.0.js"></script>
Mã HTML như sau:
<div id="feature_list">
<ul id="tabs">
<li> <a href="javascript:;"> <img src="services.png" />
<h3>Services</h3>
<span>Lorem ipsum dolor sit amet consect</span> </a> </li>
<li> <a href="javascript:;"> <img src="programming.png" />
<h3>Programming</h3>
<span>Lorem ipsum dolor sit amet consect</span> </a> </li>
<li> <a href="javascript:;"> <img src="applications.png" />
<h3>Applications</h3>
<span>Lorem ipsum dolor sit amet consect</span> </a> </li>
</ul>
<ul id="output">
<li> <img src="sample1.jpg" /> <a href="#">See project details</a> </li>
<li> <img src="sample2.jpg" /> <a href="#">See project details</a> </li>
<li> <img src="sample3.jpg" /> <a href="#">See project details</a> </li>
</ul>
</div>Để Featured List plugin hoạt động và tùy chỉnh các hiệu ứng, bạn cần thêm:
$(document).ready(function() {
$.featureList(
$("#tabs li a"),
$("#output li"), {
start_item : 1
}
);
});
Hoặc bạn có thể sử dụng: (1 trong 2 cách)
$(document).ready(function() {
$('#tabs li a').featureList({
output : '#output li',
start_item : 1
});
});
Bạn có thích bài viết này?
Neo
Nhìn mặt trời từ năm 1984 nhưng tới tận 2002 mới được thấy cái máy tính đầu tiên của mình. Đầu năm 2007 thì quyết định theo cái nghề cao quý là thiết kế web 
. Hiện mình đang sống tại Hà Nội. Sở thích: làm website và giúp đỡ mọi người phát triển website theo chiều hướng tốt đẹp hơn.