Tiny Customizable Star Rating Plugin For jQuery - Ratyli

File Size: 12.5 KB
Views Total: 1431
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Tiny Customizable Star Rating Plugin For jQuery - Ratyli

Ratyli is a simple, lightweight yet highly customizable jQuery / HTML5 rating system which can be configured with JavaScript or datasets.

How to use it:

1. Make sure the jQuery Ratyli plugin is loaded after jQuery library but before the closing body tag.

<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="jquery.ratyli.js"></script>

2. Include the Font Awesome 4 for custom rating symbols (OPTIONAL).

<link rel="stylesheet" href="font-awesome.min.css">

3. Call the plugin to generate a default rating system that uses plain html for star icons.

$(".ratyli").ratyli();

4. Customize the rating system via HTML5 data-* attributes on your element.

<span class="ratyli" data-rate="2" data-ratemax="3"></span>

5. You can also pass the customization options to ratyli() method as an object.

$("#selector").ratyli({
  disable: false,
  unrateable: false,
  full: "★",
  empty: "☆",
  cursor:"default",
  rate:0,
  ratemax:5,
});

6. Callback functions available.

$("#selector").ratyli({
  onSignEnter:function(){},
  onSignLeave:function(){},
  onSignClick:function(){},
  onRated:function(){}
});

This awesome jQuery plugin is developed by peet86. For more Advanced Usages, please check the demo page or visit the official website.