diff --git a/examples/rate.html b/examples/rate.html
index ee36787c..6b99d586 100644
--- a/examples/rate.html
+++ b/examples/rate.html
@@ -55,22 +55,34 @@ layui.use(['rate'], function(){
var rate = layui.rate;
//渲染
- /*
- rate.set({
- elem: '#test1'
- ,length: 7
- ,value: 4.7
- ,theme: '#c00'
- ,half: true
- ,text: true
- ,reader: true
- })
- */
-
+
+ // rate.set({
+ // elem: '#test1'
+ // ,length: 7
+ // ,value: 4.7
+ // ,theme: '#c00'
+ // ,half: true
+ // ,text: true
+ // ,reader: true
+ // })
+
rate.render({
elem: '#test1'
- ,length: 5
+ ,length: 3
,value: 2.2
+ ,text: true
+ ,half: true
+ ,setText: function(value){
+
+ var arrs = {
+ '0.5': '极差'
+ , '1' : '一般'
+ ,'1.5': '满意'
+ ,'2': '极满意'
+ };
+
+ this.span.text(arrs[value] || ( value + "星"));
+ }
})
rate.render({
@@ -79,15 +91,20 @@ layui.use(['rate'], function(){
,value: 2
,half: true
,theme: '#5FB878'
+ ,choose: function(value){
+ if( value > 3) alert("111")
+ }
})
+
rate.render({
elem: '#test3'
- ,length: 5
+ ,length: 3
,value: 2.8
,text: true
,half: true
,theme: '#FF5722'
})
+
rate.render({
elem: '#test4'
,length: 8
diff --git a/src/css/layui.css b/src/css/layui.css
index c8f322d1..c3692011 100644
--- a/src/css/layui.css
+++ b/src/css/layui.css
@@ -1037,11 +1037,14 @@ body .layui-table-tips .layui-layer-content{background: none; padding: 0; box-sh
.layui-upload-wrap .layui-upload-file{display: block!important; position: absolute; left: 0; top: 0; z-index: 10; font-size: 100px; width: 100%; height: 100%; opacity: .01; filter: Alpha(opacity=1); cursor: pointer;}
/** 评分组件 **/
-.layui-icon-rate,.layui-icon-rate-solid,.layui-icon-rate-half{font-size: 24px;color: #FFB800;}
-.layui-rate-div{height: 120px;border: 1px solid #EEE;border-radius: 5px; padding: 20px;margin-top: 10px;margin-bottom: 10px;transition: 300ms;}
-.layui-rate-div:hover{box-shadow: 0 0 10px #CCC; transition: 300ms;}
-.layui-rate{display: inline-block; list-style: none; padding: 10px;}
-.layui-rate li:hover{cursor: pointer;}
+.layui-icon-rate,
+.layui-icon-rate-solid,
+.layui-icon-rate-half{ font-size: 20px; color: #FFB800;}
+.layui-rate,
+.layui-rate *{display: inline-block; vertical-align: middle;}
+.layui-rate{list-style: none; padding: 10px 5px 10px 0; font-size: 0;}
+.layui-rate li i{margin-right: 5px; transition: all .3s; -webkit-transition: all .3s;}
+.layui-rate li i:hover{cursor: pointer; transform: scale(1.12); -webkit-transform: scale(1.12);}
@@ -1280,7 +1283,8 @@ body .layui-util-face .layui-layer-content{padding:0; background-color:#fff; co
.layui-anim{-webkit-animation-duration: 0.3s; animation-duration: 0.3s; -webkit-animation-fill-mode: both; animation-fill-mode: both;}
.layui-anim.layui-icon{display: inline-block;}
.layui-anim-loop{-webkit-animation-iteration-count: infinite; animation-iteration-count: infinite;}
-.layui-trans,.layui-trans a{transition: all .3s; -webkit-transition: all .3s;} /* 过度变换 */
+.layui-trans,
+.layui-trans a{transition: all .3s; -webkit-transition: all .3s;} /* 过度变换 */
@-webkit-keyframes layui-rotate{ /* 循环旋转 */
from {-webkit-transform: rotate(0deg);}
diff --git a/src/lay/modules/rate.js b/src/lay/modules/rate.js
index b8c4311e..66616eed 100644
--- a/src/lay/modules/rate.js
+++ b/src/lay/modules/rate.js
@@ -1,4 +1,10 @@
+/**
+ @Title: layui.upload 文件上传
+ @Author: star
+ @License：MIT
+
+ */
layui.define('jquery',function(exports){
"use strict";
@@ -62,7 +68,7 @@ layui.define('jquery',function(exports){
Class.prototype.render = function(){
var that = this
,options = that.config
- ,style = 'style="color: '+ options.theme + ';"';
+ ,style = options.theme ? ('style="color: '+ options.theme + ';"') : '';
options.elem = $(options.elem);
@@ -83,7 +89,7 @@ layui.define('jquery',function(exports){
if(options.half){
if(parseInt(options.value) !== options.value){
if(i == Math.ceil(options.value)){
- temp = temp + '';
+ temp = temp + '';
}else{
temp = temp + item
}
@@ -94,7 +100,7 @@ layui.define('jquery',function(exports){
temp = temp +item;
}
}
- temp += '' + (options.text ? options.value + "分" : "") + '';
+ temp += '' + (options.text ? (''+ options.value + '星') : '') + '';
//开始插入替代元素
var othis = options.elem
@@ -104,6 +110,11 @@ layui.define('jquery',function(exports){
hasRender[0] && hasRender.remove(); //如果已经渲染，则Rerender
that.elemTemp = $(temp);
+
+ options.span = that.elemTemp.next('span');
+
+ options.setText && options.setText(options.value);
+
othis.html(that.elemTemp);
othis.addClass("layui-inline");
@@ -126,7 +137,8 @@ layui.define('jquery',function(exports){
Class.prototype.action = function(){
var that = this
,options = that.config
- ,_ul = that.elemTemp;
+ ,_ul = that.elemTemp
+ ,wide = _ul.find("i").width();
_ul.children("li").each(function(index){
var ind = index + 1
@@ -139,12 +151,16 @@ layui.define('jquery',function(exports){
if(options.half){
//获取鼠标在li上的位置
var x = e.pageX - $(this).offset().left;
- if(x <= 13){
+ if(x <= wide / 2){
options.value = options.value - 0.5;
}
}
- if(options.text) _ul.next("span").text(options.value + "分")
- })
+
+ if(options.text) _ul.next("span").text(options.value + "星");
+
+ options.choose && options.choose(options.value);
+ options.setText && options.setText(options.value);
+ });
//移入
othis.on('mousemove', function(e){
@@ -157,14 +173,14 @@ layui.define('jquery',function(exports){
// 如果设置可选半星，那么判断鼠标相对li的位置
if(options.half){
var x = e.pageX - $(this).offset().left;
- if(x <= 13){
+ if(x <= wide / 2){
othis.children("i").addClass(ICON_RATE_HALF).removeClass(ICON_RATE_SOLID)
}
}
})
//移出
- othis.on('mouseout', function(){
+ othis.on('mouseleave', function(){
_ul.find("i").each(function(){
$(this).addClass(ICON_RATE).removeClass(ICON_SOLID_HALF)
});