Beautiful jQuery Star Rating Plugin - EWS Rating Stars
File Size: | 56.7 KB |
---|---|
Views Total: | 1557 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
EWS Rating Stars is an easy jQuery plugin to create beautiful rating widgets with customizable star symbols based on CSS Sprites technique.
How to use it:
1. Download and include the jQuery EWS rating stars plugin's JS and CSS in the document.
<link href="path/to/ewsRatingStars.jquery.css" rel="stylesheet"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> <script src="path/to/ewsRatingStars.jquery.js"></script>
2. Create an DIV element that will act as a container for the star rating widget.
<div class="demo"></div>
3. Call the plugin on the DIV element to generate a basic 5-star rating widget.
$('.demo').ewsRatingStars();
4. Available options.
$('.demo').ewsRatingStars({ // Name of stars input name : 'rating_stars', // Default value defaultValue : 0, // Is stars disabled or not disabled : false, // Default star width starWidth : 36, // Default star height starHeight : 28, // Number of stars starNumber : 5, // Spaces between stars in pixels starSpaces : 0, // Normal star position inside background sprite normalPosition : { x : 0, y : 0 }, // Hover star position inside background sprite activePosition : { x : 0, y : 28 }, // Active star position inside background sprite hoverPosition : { x : 0, y : 58 }, // Additional class - used to change star image sprite // 'ewsRatingStarColorGreen', 'ewsRatingStarColorRed' // 'ewsRatingStarColorGreen' or leave blank class : '', // Called when value is set onSetValue : null, // Called when rating is unset onUnset : null });
This awesome jQuery plugin is developed by milosglavinic. For more Advanced Usages, please check the demo page or visit the official website.