theluyuan/layui-js
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

第一次配置

Browse Source
This commit is contained in:
star 2018-04-24 14:56:49 +08:00
parent 083e8ec782
commit ca1819d70f
8 changed files with 97 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

62
examples/rate.html
View File

@ -13,16 +13,72 @@ body{padding:20px;}
</head>
<body>
<div class="layui-container">
<div class="layui-row">
<!-- 基础评分用法 -->
<div class="layui-rate layui-col-xm4 layui-col-xm-offset4 ">
<h3>基础用法</h3>
<hr>
<ul class="layui-rate-primary">
<li class="layui-inline"><i class="layui-icon layui-icon-rate"></i></li>
<li class="layui-inline"><i class="layui-icon layui-icon-rate"></i></li>
<li class="layui-inline"><i class="layui-icon layui-icon-rate"></i></li>
<li class="layui-inline"><i class="layui-icon layui-icon-rate"></i></li>
<li class="layui-inline"><i class="layui-icon layui-icon-rate"></i></li>
</ul>
</div>
<i class="layui-icon layui-icon-rate"></i>
<!-- 半星评分用法 -->
<div class="layui-rate layui-col-xm4 layui-col-xm-offset4 ">
<h3>选中半星</h3>
<hr>
<ul class="layui-rate-half">
<li class="layui-inline"><i class="layui-icon layui-icon-rate"></i></li>
<li class="layui-inline"><i class="layui-icon layui-icon-rate"></i></li>
<li class="layui-inline"><i class="layui-icon layui-icon-rate"></i></li>
<li class="layui-inline"><i class="layui-icon layui-icon-rate"></i></li>
<li class="layui-inline"><i class="layui-icon layui-icon-rate"></i></li>
</ul>
</div>
<!-- 显示提示文字 -->
<div class="layui-rate layui-col-xm4 layui-col-xm-offset4 ">
<h3>显示提示文字</h3>
<hr>
<ul class="layui-rate-text">
<li class="layui-inline"><i class="layui-icon layui-icon-rate"></i></li>
<li class="layui-inline"><i class="layui-icon layui-icon-rate"></i></li>
<li class="layui-inline"><i class="layui-icon layui-icon-rate"></i></li>
<li class="layui-inline"><i class="layui-icon layui-icon-rate"></i></li>
<li class="layui-inline"><i class="layui-icon layui-icon-rate"></i></li>
</ul>
<span></span>
</div>
<!-- 只读 -->
<div class="layui-rate layui-col-xm4 layui-col-xm-offset4 ">
<h3>只读</h3>
<hr>
<ul class="layui-rate-read">
<li class="layui-inline"><i class="layui-icon layui-icon-rate-solid"></i></li>
<li class="layui-inline"><i class="layui-icon layui-icon-rate-solid"></i></li>
<li class="layui-inline"><i class="layui-icon layui-icon-rate"></i></li>
<li class="layui-inline"><i class="layui-icon layui-icon-rate"></i></li>
<li class="layui-inline"><i class="layui-icon layui-icon-rate"></i></li>
</ul>
</div>
</div>
</div>
<script src="../src/layui.js"></script>
<script>
layui.use(['element', 'form'], function(){
layui.use(['rate'], function(){
var rate = layui.rate;
rate.primary(".layui-rate-primary","li"){
}
});
</script>
</body>

12
src/css/layui.css
View File

@ -363,8 +363,11 @@ a cite{font-style: normal; *cursor:pointer;}
.layui-icon-cellphone:before { content: "\e678"; }
.layui-icon-rate:before { content: "\e67b"; }
.layui-icon-rate-solid:before { content: "\e67a"; }
.layui-icon-rate-half:before { content: "\e6c9"; }
/* 基本布局 */
@ -1033,6 +1036,15 @@ body .layui-table-tips .layui-layer-content{background: none; padding: 0; box-sh
.layui-upload-wrap{position: relative; display: inline-block; vertical-align: middle;}
.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{font-size: 24px;color: #FF7F00;}
.layui-rate{height: 120px;border: 1px solid #EEE;border-radius: 5px;padding: 20px;margin-top: 10px;margin-bottom: 10px;transition: 300ms;}
.layui-rate:hover{box-shadow: 0 0 10px #CCC; transition: 300ms;}
.layui-rate-primary,.layui-rate-half,.layui-rate-text,.layui-rate-read{display: inline-block;list-style: none;padding: 20px;}
.layui-rate-primary li,.layui-rate-half li,.layui-rate-text li:hover{cursor: pointer;}
/** 代码修饰器 **/
.layui-code{position: relative; margin: 10px 0; padding: 15px; line-height: 20px; border: 1px solid #ddd; border-left-width: 6px; background-color: #F2F2F2; color: #333; font-family: Courier New; font-size: 12px;}

BIN
src/font/iconfont.eot
View File

Binary file not shown.

3
src/font/iconfont.svg
View File

@ -144,6 +144,9 @@ t9.5 -10.5t21.5 -4h37h67h81h80h64h36q23 0 34 12t2 38q-5 13 -9.5 30.5t-9.5 34.5q-
<glyph glyph-name="duigou" unicode="&#58904;" d="M0.055-30.783c0.341-0.341 0.683-0.683 1.023-1.023-0.881-0.199-1.222 0.142-1.023 1.023zM422.68-31.806c0.341 0.341 0.683 0.683 1.023 1.023 0.199-0.881-0.142-1.222-1.023-1.023zM1188.586 507.499c0.796-6.455-2.732-8.658-7.385-10.598-135.179-56.381-231.75-157.232-314.81-273.594-48.424-67.839-89.128-140.154-123.426-216.017-5.928-13.112-8.996-15.349-20.062-4.384-87.123 86.327-174.761 172.135-262.272 258.071-12.668 12.439-25.155 25.098-38.381 36.921-9.294 8.308-10.355 13.069 2.455 19.008 33.244 15.413 66.428 31.089 98.694 48.415 13.919 7.474 22.089 4.601 32.375-5.67 54.34-54.26 109.269-107.929 164.023-161.773 15.688-15.428 15.25-15.216 22.655 5.97 23.948 68.521 59.387 131.482 96.277 193.496 83.563 140.471 176.983 274.364 274.181 405.661 2.902 3.92 4.786 11.051 10.606 9.738 5.874-1.324 3.992-8.698 4.946-13.298 19.893-95.846 39.493-191.752 59.156-287.646 0.346-1.682 0.755-3.351 0.97-4.298z" horiz-adv-x="1600" />
<glyph glyph-name="rate-half" unicode="&#59081;" d="M1012.064 504l-359.552 31.008-140.512 331.04-140.512-331.552-359.552-30.496 273.024-236.544-82.016-351.552 309.056 186.528 309.056-186.528-81.504 351.552 272.544 236.544zM512 195.96799999999996l0 465.056 85.504-202.016 219.04-19.008-166.016-144.032 50.016-214.016-188.512 114.016z" horiz-adv-x="1024" />
<glyph glyph-name="tianjia1" unicode="&#58888;" d="M509.989715-60.972421c-246.734474 0-446.75195 200.023616-446.75195 446.75809 0 246.732427 200.017476 446.75195 446.75195 446.75195 246.733451 0 446.757067-200.019523 446.757067-446.75195C956.746782 139.051195 756.723166-60.972421 509.989715-60.972421L509.989715-60.972421zM509.989715 812.433746c-235.633648 0-426.650123-191.014428-426.650123-426.648077 0-235.639788 191.016475-426.654216 426.650123-426.654216 235.638765 0 426.654216 191.014428 426.654216 426.654216C936.643931 621.419318 745.62848 812.433746 509.989715 812.433746L509.989715 812.433746zM527.863804 153.46958l-35.741016 0L492.122789 367.909533 277.678742 367.909533 277.678742 403.653619l214.443024 0L492.121765 618.095619l35.741016 0L527.862781 403.653619l214.442 0 0-35.744086L527.863804 367.909533 527.863804 153.46958 527.863804 153.46958zM527.863804 153.46958" horiz-adv-x="1024" />

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 270 KiB

After

Width:  |  Height:  |  Size: 270 KiB

BIN
src/font/iconfont.ttf
View File

Binary file not shown.

BIN
src/font/iconfont.woff
View File

Binary file not shown.

21
src/lay/modules/rate.js Normal file
View File

@ -0,0 +1,21 @@
layui.define('jquery',function(){
"use strict";
var $ = layui.jquery;
var rate={
primary:function(e,x){
$(e x).each(function(index){
var index=index;
$(this).mouseover(function(){
// $(e > x:lt(index+1) i).addClass("layui-icon-rate-solid").removeClass("layui-icon-rate");
console.log(11);
});
$(this).click(index){
}
})
};
};
exports('rate', rate);
})

2
src/layui.js
View File

@ -67,6 +67,8 @@
,mobile: 'modules/mobile' //移动大模块 | 若当前为开发目录，则为移动模块入口，否则为移动模块集合
,'layui.all': '../layui.all' //PC模块合并版
,rate: 'modules/rate' //评分组件
};
//记录基础数据