基本信息
源码名称:鼠标滑过五角星打分星级评分代码jQuery
源码大小:0.04M
文件格式:.zip
开发语言:js
更新时间:2019-07-03
友情提示:(无需注册或充值,赞助后即可获取资源下载链接)
嘿,亲!知识可是无价之宝呢,但咱这精心整理的资料也耗费了不少心血呀。小小地破费一下,绝对物超所值哦!如有下载和支付问题,请联系我们QQ(微信同号):78630559
本次赞助数额为: 2 元×
微信扫码支付:2 元
×
请留下您的邮箱,我们将在2小时内将文件发到您的邮箱
源码介绍
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jQuery鼠标滑过五角星打分星级评分代码</title>
<link rel="stylesheet" href="css/css.css">
<script src="js/jquery.js"></script>
</head>
<body><script src="/demos/googlegg.js"></script>
<div id="starRating">
<p class="photo">
<span><i class="high"></i><i class="nohigh"></i></span>
<span><i class="high"></i><i class="nohigh"></i></span>
<span><i class="high"></i><i class="nohigh"></i></span>
<span><i class="high"></i><i class="nohigh"></i></span>
<span><i class="high"></i><i class="nohigh"></i></span>
</p>
<p class="starNum">0.0分</p>
<div class="bottoms">
<a class="garyBtn cancleStar">取消评分</a><a class="blueBtn sureStar">确认</a>
</div>
</div>
<script>
$(function () {
//评分
var starRating = 0;
$('.photo span').on('mouseenter',function () {
var index = $(this).index() 1;
$(this).prevAll().find('.high').css('z-index',1)
$(this).find('.high').css('z-index',1)
$(this).nextAll().find('.high').css('z-index',0)
$('.starNum').html((index*2).toFixed(1) '分')
})
$('.photo').on('mouseleave',function () {
$(this).find('.high').css('z-index',0)
var count = starRating / 2
if(count == 5) {
$('.photo span').find('.high').css('z-index',1);
} else {
$('.photo span').eq(count).prevAll().find('.high').css('z-index',1);
}
$('.starNum').html(starRating.toFixed(1) '分')
})
$('.photo span').on('click',function () {
var index = $(this).index() 1;
$(this).prevAll().find('.high').css('z-index',1)
$(this).find('.high').css('z-index',1)
starRating = index*2;
$('.starNum').html(starRating.toFixed(1) '分');
alert('评分:' (starRating.toFixed(1) '分'))
})
//取消评分
$('.cancleStar').on('click',function () {
starRating = 0;
$('.photo span').find('.high').css('z-index',0);
$('.starNum').html(starRating.toFixed(1) '分');
})
//确定评分
$('.sureStar').on('click',function () {
if(starRating===0) {
alert('最低一颗星!');
} else {
alert('评分:' (starRating.toFixed(1) '分'))
}
})
})
</script>
</body>
</html>