Chủ nhật, ngày 4 tháng 12 năm 2016

Đánh giá bài viết với jRating

Ngày đăng: 27/4/2011, 16:25:57PM | Lượt xem: 2,092
Hot!

jRating - một plugin rất mềm dẻo của jQuery giúp bạn nhanh chóng tạo được hệ thống đánh giá dạng ajax.

Demo

Bạn có thể tùy chỉnh từng chi tiết nhỏ nhất, từ số lượng các ngôi sao tới việc từng ngôi sao đại diện cho số thập phân thế nào. Ngoài ra còn có các lựa chọn hiển thị ngôi sao nhỏ hay lớn hoặc bạn có thể thay thế file ảnh với file khác.

Bạn có thể sử dụng plugin với tất cả các ngôn ngữ php, .NET, java... (tất nhiên vì đây chỉ là phần frontend thôi), plugin được đi kèm file php để xử lý các đánh giá của người dùng.

Cách sử dụng

Để sử dụng, trước tiên bạn cần thêm file CSS, file jQuery 1.4 và jRating vào phần header:

1 <!-- jRating CSS -->
2 <link rel="stylesheet" href="jRating.jquery.css" type="text/css" />
3  
4 <!-- jRating và file jQuery --> 
5 <script type="text/javascript" src="jquery.js"></script
6 <script type="text/javascript" src="jRating.jquery.js"></script>

Thêm vào phần body của website:

1 <div class="jRating" data="12_1"></div> <!-- Giá trị trung bình là 12 và ID là 1 -->
2 <div class="jRating" data="8.5_2"></div> <!-- Giá trị trung bình là 8.5 và ID là 2 -->

Với jRating, thuộc tính data rất quan trọng, bạn phải thêm vào theo mẫu: 'mức trung bình'_'ID'

Cuối cùng là gọi plugin lên làm việc:

1 // Cách gọi đơn giản
2 $('.jRating').jRating();
3 // Cách gọi tùy biến lựa chọn
4 $('.jRating').jRating({
5      step : false, // cho phép lựa chọn nửa ngôi sao
6      length : 10, // hiển thị 10 ngôi sao
7      type : 'small' // hiển thị ngôi sao nhỏ (mặc định là sao lớn)
8    });

Bạn có thể xem thêm các lựa chọn khác ở trang chủ và trang demo của plugin

 Chia sẻ qua: 
Hot!
Ý kiến bạn đọc

These items will be permanently deleted and cannot be recovered. Are you sure?

Gallery

image

Maecenas viverra rutrum pulvinar

Maecenas viverra rutrum pulvinar! Aenean vehicula nulla sit amet metus aliquam et malesuada risus aliquet. Vestibulum rhoncus, dolor sit amet venenatis porta, metus purus sagittis nisl, sodales volutpat elit lorem…

Read more

Text Links

Thiết kế logo chuyên nghiệp Insky
DAFABET
W88 w88b.com/dang-ky-tai-khoan-w88
W88
Copyright © 2011 - 2012 vietshare.vn by phamkhuong102@gmail.com doanhkisi2315@gmail.com. All rights reserved.