Small Custom Star Rating Plugin For jQuery - Stars.js

Stars.js is a jQuery plugin for generating a star rating system that allows any icon fonts, variable star sizes, colors and init values.

Basic usage:

1. Load a icon font of your choice in the document. By default, the plugin uses Font Awesome 4 for star symbols.

<link rel="stylesheet" href="/path/to/font-awesome.min.css">
<!-- Or use Bootstrap's Glyphicons -->
<link rel="stylesheet" href="/path/to/bootstrap.min.css">

2. Create an empty container for the star rating system.

<div class="basic">
</div>

3. Load jQuery library and the jQuery star.js plugin at the end of the document.

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

4. Generate a basic rating system inside the container you just created and use Font Awesome icons for star symbols.

$(".basic").stars();

5. Use Bootstrap's Glyphicons for star symbols.

$(".basic").stars({
  emptyIcon: 'glyphicon glyphicon-star-empty',
  filledIcon: 'glyphicon glyphicon-star'
});

6. All default options which can be used to customize the rating system.

$(".basic").stars({

  // how many stars to display
  stars: 5,

  // custom star icons
  emptyIcon: 'fa-star-o',
  filledIcon: 'fa-star',

  // star color
  color: '#E4AD22',

  // init value
  value: 0,

  // Array of strings, tooltips for each star
  text: null,

  // callback function
  click: function() {}
  
});

---

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