Jquery 评分插件

最新推荐文章于 2024-09-16 08:47:17 发布

似懂非懂888

最新推荐文章于 2024-09-16 08:47:17 发布

阅读量114

点赞数

分类专栏： Jquery插件文章标签： jquery javascript 评分插件 ViewUI

本文链接：https://blog.csdn.net/xf402719549/article/details/84220936

版权

Jquery插件专栏收录该内容

1 篇文章 0 订阅

订阅专栏

大小：3KB
发布日期：2012-5-20
版本：1.0
共享：免费（不用商业用途的情况下可任意使用。）
开发者：似懂非懂

Blog：www.haw86.com

<!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=utf-8" />
<title>五角星评分插件</title>
<script language="javascript" src="js/jquery-1-7-2.js"></script>
<script language="javascript" src="js/jquery.Score.js"></script>
<script type="text/javascript">
$(function(){
	$("#scoreBox > #maskBox").Score({
		triggerType:"click",//鼠标触发方式 
		visible:1,//显示方式 1:显示完整节点，2:一个分两个节点s显示
		showBranch:5,//分数
		icoBefore:"images/30-30-off.png",//灰色的图片地址
		icoAfter:"images/30-30-on.png", //彩色的图片地址
		layerBefore:"#scoreBox",//Doems的最大层
		bgBox:"#starBg",//背景显示的层
		inputCls:"#scoreValue",//文本域对象
		showWidth:30, //子元素宽度
		showHeight:30 //子元素高度
	});
})	
</script>
<style>
.scoreBox{ width:0px; height:10px; position:relative;}
.starBg{ width:0px; height:10px; position:relative; z-index:1; }
.maskBox{display:block; width:50px; height:10px; overflow:hidden; position:absolute; z-index:2; top:0px; left:0px; padding:0px; margin:0px;}
.maskBox li{display:block;width:5px; height:10px; overflow:hidden; float:left; cursor:pointer;}
</style>
</head>

<body>

<div class="scoreBox" id="scoreBox">
	<ul class='maskBox' id='maskBox'></ul>
    <div class="starBg" id="starBg"></div>
	<input type="hidden" id="scoreValue" value="2" />
</div>



</body>
</html>