Smooth Star Rating Plugin with jQuery and CSS3 - voteStar.js

voteStar.js is a tiny jQuery star rating plugin that uses CSS3 transitions for smooth fill animations.

How to use it:

1. Load jQuery library and the jQuery voteStar.js plugin's JS & CSS files in your web project.

<link rel="stylesheet" href="dist/voteStar.css">
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="dist/jquery.voteStar.js"></script>

2. Create a star rating system using inline html elements as follow. The data-starnum attribute is used to specify the initial value.

<span class="event_star star_big" data-starnum="3"><i></i></span>
<span class="event_star star_in" data-starnum="3.5"><i></i></span>
<span class="event_star star_small" data-starnum="2"><i></i></span>

3. Initialize the star rating system by calling the fucntion on the top element.

$('.event_star').voteStar({
  // OPTIONS HERE
})  

4. There are a few options you can use when initializing the plugin.

$('.event_star').voteStar({

// highlight the rating stars on mouse move
moveStar: false, 

// the number of rating stars
starLength: 5,

// enable half-stars
precise: false, 

// enable animation
starAnimate: true,

// callback function
callback: null 

})  

---

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