Click here to Skip to main content
15,894,291 members
Articles / Programming Languages / Javascript

SVG Based Star Rating Control

Rate me:
Please Sign up or sign in to vote.
4.68/5 (12 votes)
23 Apr 2012GPL35 min read 28K   430   14  
A Star Rating Control that uses SVG instead of image sprites
<!doctype html>
<html>
<head>
</head>
<body>
	<div id="my_widget"
		class="rating_widget" 
		number_of_stars="5"
		initial_value="0"
		default_color="#ccc"
		initial_value_color="#ff0"
		final_value_color="#f00"
		captions="Poor, Didn't like it, OK, Good, Excellent!"
		onclick="clickHandler"
	></div>
<script src="star_rating.js">	
</script>
<script>
	function clickHandler(sender, args)
	{
		alert('your rating: ' + args);
	}	
</script>
</body>
</html>

By viewing downloads associated with this article you agree to the Terms of Service and the article's licence.

If a file you wish to view isn't highlighted, and is a text file (not binary), please let us know and we'll add colourisation support for it.

License

This article, along with any associated source code and files, is licensed under The GNU General Public License (GPLv3)


Written By
Software Developer
United States United States
Creator of bookmine.net

Comments and Discussions