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
   
Beautiful jQuery Star Rating Plugin - EWS Rating Stars

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.