Text masks:
%m - mean rate (measured in %)
%ms - mean rate (stars)
%p - hover/pointed rate (%)
%ps - hover/pointed rate (stars)
%i - hover/pointed index number (depends on | number in texthover)
%maxs - total number of stars
%v - number of votes
%r and %rr - total (%r) and rest (%rr=%r-%v) required number of votes to display stats
Execute your custom functions on following events:
on stats loaded<!DOCTYPE html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Five Stars</title> <!-- Including style for tooltip if necessary --> <link type="text/css" rel="stylesheet" href="css/tooltip.css"/> <!-- Including jQuery 1.7 or higher and rating plugin --> <script type="text/javascript" src="js/jquery-1.7.1.min.js"></script> <script type="text/javascript" src="js/jquery.5stars.min.js"></script> <!-- Starting rating plugin --> <script type="text/javascript"> $(document).ready(function(){ //start plugin with settings $(".stars").rating({ php : 'path/to/manager.php', //path to manager.php file relative to HTML document. Not required in Display-only and Database-free modes. skin : 'skins/skin.png', //path to skin file relative to HTML document }); }); </script> </head> <body> <p>Normal mode (stats stored in database, requires PHP)</p> <!-- 1. Stars will appear here. Note: unique item Id is required --> <div class="stars" data-id="itemId" data-title="optional short item description"></div> <p>Display-only mode (displays values which you provide in html)</p> <!-- 2. Display-only mode --> <div class="stars" data-value="60" data-votes="45" data-displaymode="true"></div> <p>Database-free mode: rate stored locally (browser MUST support <a href="http://diveintohtml5.info/storage.html">HTML5 localstorage</a>)</p> <!-- 3. Database-free mode (browser MUST support HTML5 localstorage) Note: unique item Id is required; php MUST be set to "" --> <div class="stars" data-id="itemId2" data-php="" data-textmain="you gave %ms out of %maxs stars"></div> </body> </html>