jQuery rating - how to show chosen value on hover?
Question
I'm using jquery.rating.js
plugin and I wrote a litle function that shows the value of clicked input but I want to show the value on hover too.
$(document).ready(function() {
if($('.star-rating-on')) {
$('.star-rating-on a').live('click', function() {
var note1 = $('.star-rating-on a:last').attr('title');
$('#i-choose').html(note1 +'.0');
});
} else {
$('.star-rating-hover a:last').live('hover', function() {
var note = $('.star-rating-hover a:last').attr('title');
$('#i-choose').html(note +'.0');
});
}
})
the html
<input type="radio" class="star required" value="1" name="rating" />
<input type="radio" class="star required" value="2" name="rating" />
<input type="radio" class="star required" value="3" name="rating" />
<input type="radio" class="star required" value="4" name="rating" />
<input type="radio" class="star required" value="5" name="rating" />
<div id="i-choose">Your rate</div>
first problem: on hover doesn't show the value. second problem: show earlier selected value if I accidentaly point cursor on the input.
Solution
You don't have to involve jQuery in the hover feature, unless I've misunderstood something or unless you want to style the hover text.
If you add title="1"
to the input then the tooltip will display 1
when you hover it.
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow