68 lines
2.4 KiB
PHP
68 lines
2.4 KiB
PHP
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||
|
|
<html xmlns="http://www.w3.org/1999/xhtml">
|
||
|
|
<head>
|
||
|
|
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
|
||
|
|
<title>Rating</title>
|
||
|
|
<script type="text/javascript" src="js/jquery.js"></script>
|
||
|
|
<script type="text/javascript" src="js/rating.js"></script>
|
||
|
|
<link rel="stylesheet" type="text/css" href="css/rating.css" />
|
||
|
|
<script type="text/javascript">
|
||
|
|
$(document).ready(function() {
|
||
|
|
$('#star1').rating('www.url.php', {maxvalue: 1});
|
||
|
|
$('#star2').rating('www.url.php', {maxvalue:1, curvalue:1});
|
||
|
|
$('#rate1').rating('www.url.php', {maxvalue:5});
|
||
|
|
$('#rate2').rating('www.url.php', {maxvalue:5, curvalue:3});
|
||
|
|
});
|
||
|
|
</script>
|
||
|
|
<style type="text/css">
|
||
|
|
.implementation{
|
||
|
|
border:dashed 2px #333333;
|
||
|
|
background-color:#CCCCCC;
|
||
|
|
color:#000000;
|
||
|
|
width:50%;
|
||
|
|
}
|
||
|
|
|
||
|
|
.spacer{
|
||
|
|
clear:both;
|
||
|
|
height:0px;
|
||
|
|
}
|
||
|
|
.left{
|
||
|
|
float:left;
|
||
|
|
width:250px;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<div>
|
||
|
|
<h1>Simple Star Rating System </h1>
|
||
|
|
</div>
|
||
|
|
<div>
|
||
|
|
This is a jquery plugin for star rating systems. The intial inspiration for this script came from "Wil Stuckey's" star rating system. But the original script requires too much coding. Also it does not have provision for developing a star system (such as GMail, where you star or un star an email). I have modified the original script to make it simpler for user to develop a star rating system. Check the demo below - hover and click on stars to change there state </div>
|
||
|
|
<div><h2>Examples</h2></div>
|
||
|
|
<div id="star1" class="rating"> </div>
|
||
|
|
<div class="implementation">
|
||
|
|
<pre>$('#star1').rating('www.url.php', {maxvalue:1});</pre>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div id="star2" class="rating"> </div>
|
||
|
|
<div class="implementation">
|
||
|
|
<pre>$('#star2').rating('www.url.php', {maxvalue:1, curvalue:1});</pre>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div id="rate1" class="rating"> </div>
|
||
|
|
<div class="implementation">
|
||
|
|
<pre>$('#rate1').rating('www.url.php', {maxvalue:5});</pre>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
<div id="rate2" class="rating"> </div>
|
||
|
|
<div class="implementation">
|
||
|
|
<pre>$('#rate2').rating('www.url.php', {maxvalue:5, curvalue:3});</pre>
|
||
|
|
</div>
|
||
|
|
<div> </div>
|
||
|
|
<div>
|
||
|
|
As you might have notice, for single star, the script works like a star/unstarl. For two or more stars, it works as a rating system. To value at the server end can be recieved via post variable named "rating".
|
||
|
|
</div>
|
||
|
|
</body>
|
||
|
|
</html>
|