Example | Description |
---|---|
Five stars with tooltips. You may submit only one rating. For tooltips you must include tipsy. |
|
Six stars, you can't vote. | |
Three stars with tooltips. You can vote repeatedly. | |
Ten stars, you can vote repeatedly. | |
Eight stars, you can vote repeatedly. An alert appears on success. |
Set up your HTML markup
<div id="starry" name="starry"></div>
Add starry.css and starry.js in your <head> - Don't forget jQuery!
<link rel="stylesheet" type="text/css" href="starry/starry.min.css" />
<script type="text/javascript" language="javascript" src="starry/starry.min.js"></script>
Initialize your star rating in your script file or an inline script tag
$(document).ready(function () {
var starry = new Starry('#starry');
starry.init();
});
Option | Type | Default | Description |
---|---|---|---|
stars | int | 5 | Number of rating stars. (= y) |
starSize | int | 32 | Height and width of star icons in pixel. |
multiple | boolean | false | Determines whether the user can submit several ratings. |
startValue | int | 0 | Preloaded rating. {x ∈ ℝ+ | x <= y} |
readOnly | boolean | false | Determines whether the user can submit ratings. |
iconPath | string | icons/ | Path to rating icons. |
tooltips | array | false | Tooltips for the stars. (You must include tipsy!) |
success | function | false | A function to be called if the request succeeds. The function gets passed one argument: Your rating (3 for example). |
Starry script
$(document).ready(function () {
var starry = new Starry('#starry');
starry.init({
success: function (level) {
$.post('rate.php', {
rate: level
});
}
});
});
PHP file rate.php
<?php
# rate.php
/**
* In this example, we save the rating results in our database
*/
// Read the rating result
$rate = (int)$_POST['rate'];
// Create database connection
$db = new mysqli('localhost', 'root', 'password', 'database');
// Our query
$query = "INSERT INTO `ratings` (`rating`) VALUES (?)";
$query = $db->prepare($query);
$query->bind_param('i', $rate);
$query->execute();
// Close the statement and the database connection
$query->close();
$db->close();
?>