Commit 6d9eb27a authored by 王向前's avatar 王向前

大屏

parent ebb87600
......@@ -14,5 +14,10 @@ public class KmesBoardController extends BaseController {
return "kmes/dashboard/index";
}
@RequestMapping("/first")
public String interfaceFirst() {
return "kmes/dashboard/first";
}
}
This diff is collapsed.
/*
头部*/
.header{
width: 100%;
height: 1.5rem;
/*background: red;*/
}
.header .header-left{
width: 25%;
height: 1.05rem;
color: white;
/* border: 1px solid green;*/
text-align: center;
line-height: 1.05rem;
}
.header .header-center{
width: 50%;
height: 1.2rem;
/*border: 1px solid red;*/
/* background: url("../images/head.gif") no-repeat;
background-size: 100% 100%;*/
position: relative;
}
.header .header-center .header-title{
text-align: center;
color: #ffffff;
font-size: .4rem;
text-shadow: 0 0 .3rem #00d8ff;
line-height: 1.05rem;
}
.header .header-img{
background: url("../images/head.gif") no-repeat center center;
background-size: 100%;
height: 100%;
width: 100%;
position: absolute;
top: .4rem;
}
.header .header-right{
width: 25%;
height: 1.05rem;
/*border: 1px solid gold;*/
}
.header .header-bottom{
width: calc(100% - .4rem);
height: .16rem;
background: url("../images/header.png") no-repeat;
background-size: calc(100% - .2rem) 100%;
padding: 0 .2rem;
margin-left: .3rem;
}
/*
内容*/
.center{
padding: .1rem .2rem .1rem .2rem;
}
.center .center-left{
width: 35%;
padding: .1rem;
/* border: 1px solid red;*/
}
.center .center-left .left-top{
width: 100%;
height: 6.8rem;
margin-bottom: .4rem;
}
.center .center-left .left-top h1{
color: white;
font-size: .4rem;
transform: rotateX(0deg);
/*display: flex;*/
align-items: center;
margin-bottom: 8px;
position: relative;
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
-ms-transform-style: preserve-3d;
transform-style: preserve-3d;
transform-origin: 50% 50%;
/*transform: rotateX(0deg);*/
/*width: 100%;*/
transition: transform 500ms cubic-bezier(0.15, 0.52, 0.5, 0.9) 0s;
/*height: 24px;*/
/*过渡效果*/
transition: all 1s;
}
/*.center .center-left .left-top h1:hover{
transform: rotateX(360deg);
transition: all 2s;
}*/
.title{
width: 90%;
height: 0.3rem;
/* border: 1px solid gold;*/
position: relative;
top:.1rem;
left: .25rem;
color: white;
padding-left: 0.12rem;
line-height: 0.3rem;
}
.title:before{
width: 0.05rem;
height: 0.25rem;
top: 0.02rem;
position: absolute;
content: "";
background: #59ebe8;
border-radius: 0.02rem;
left: 0;
}
.top-list p{
font-size: .18rem;
color: #029698;
padding: .3rem;
}
.top-list li{
float: left;
font-size: .2rem;
color: #ffffff;
width: 50%;
height: .8rem;
line-height: .8rem;
padding: 0 .2rem;
margin-bottom: .4rem;
}
.top-list li img{
margin: .1rem 0;
display: block;
float: left;
line-height: .8rem;
/*height: .8rem;*/
}
.top-list li span{
display: block;
float: left;
padding-left: .2rem;
line-height: .8rem;
}
.center .center-left .left-bottom{
width: 100%;
height: 3.2rem;
/*background: url("../images/panel.png") no-repeat;
background-size: 100% 100%;*/
/*border: 0.01rem solid #217093;*/
}
.center .center-left .bottom-b{
width: calc(100% - 0.2rem);
height: 2.6rem;
margin-left: 0.1rem;
margin-top: 0.1rem;
}
.center .center-cen{
width: 65%;
padding: .1rem;
}
.center .center-cen .cen-top{
width: 100%;
height: 3.2rem;
/*background: url("../images/a.png") no-repeat;
background-size: 100% 100%;*/
/*border: 0.01rem solid #217093;*/
margin-bottom: .4rem;
position: relative;
}
.center .center-cen .cen-top .top-title{
position: absolute;
width: 60%;
height: 2.2rem;
/*border: 1px solid red;*/
left: .5rem;
top:.5rem;
}
.center .center-cen .cen-top .top-title span{
font-size: .8rem;
text-align: center;
display: block;
margin: 0 auto;
line-height: 2.2rem;
float: left;
}
.center .center-cen .cen-top .top-title li{
float: left;
width: 50%;
/*height: 1rem;*/
/*border: 1px solid green;*/
}
.center .center-cen .cen-top .top-title li p,
.center .center-cen .cen-top .top-title li span,
.center .center-cen .cen-top .top-title li b{
color: #ffffff;
}
.center .center-cen .cen-top .top-title li b{
text-align: center;
display: block;
margin: .8rem auto 0 auto;
float: left;
}
.center .center-cen .cen-top .top-title li p{
padding: .1rem;
margin-left: .2rem;
}
.center .center-cen .cen-top .top-title li span{
text-align: center;
display: inline-block;
/*width: .35rem;*/
height: .45rem;
/*background: #37a9ea;*/
margin-left: .3rem;
line-height: .4rem;
font-size: .5rem;
margin-top: .6rem;
}
.datashuji{
position: absolute;
margin-bottom: .1rem;
bottom: .5rem;
left: 20%;
}
.dataright{
position: absolute;
margin-bottom: .1rem;
bottom: .5rem;
right: 5%;
}
.datashuji span,.dataright span{
font-size: .2rem !important;
}
.center .center-cen .cen-top .top-bottom{
width: 35%;
height: 2.2rem;
/*border: 1px solid red;*/
position: absolute;
top:0.5rem;
right: 0.1rem;
padding: .2rem;
/*overflow: hidden;*/
}
.center .center-cen .cen-top .top-bottom span{
font-size: .8rem;
text-align: center;
display: block;
margin: 0 auto;
line-height: 2.2rem;
}
.center .center-cen .cen-bottom{
width: 100%;
height: 6.8rem;
}
.center .center-cen .bottom-b{
width: calc(100% - 0.2rem);
height: 6.4rem;
margin-left: 0.1rem;
margin-top: 0.1rem;
}
.gun{
/* width: 100%;*/
margin-top: .2rem;
}
.gun span{
display: block;
float: left;
height: .2rem;
width: 25%;
/*background: red;*/
/*margin: 15px 10px 10px 10px;*/
/*padding: 20px;*/
text-align: center;
font-size: 0.14rem;
font-weight: 600;
color: #61d2f7;
text-align: center;
margin-bottom: .1rem;
}
#FontScroll{
width: 100%;
height: 2.3rem;
overflow: hidden;
/*float: left;*/
margin-top: .1rem;
/*margin: 0 5%;*/
/*margin-left: 50px;*/
/*background: gold;*/
}
#FontScroll ul li{
height: .32rem;
width: 100%;
color: #ffffff;
text-align: center;
line-height: .32rem;
/*border-bottom: 1px dashed #404040;*/
/*width:33.3%;*/
overflow: hidden;
font-size: 0.14rem;
/*border-bottom: 1px dashed #404040;*/
/*width:33.3%;*/
/*background: red;
margin: 0 2%;*/
}
/*#FontScroll ul li:nth-child(1){
!*background-color: #072951;*!
box-shadow: -10px 0px 15px #034c6a inset, !*左边阴影*!
10px 0px 15px #034c6a inset;
}
#FontScroll ul li:hover{
box-shadow: -10px 0px 15px #034c6a inset, !*左边阴影*!
10px 0px 15px #034c6a inset;
cursor: pointer;
}*/
.fontInner span{
display:inline-block;
/*float: left;*/
/*height: 20px;*/
width:24%;
color: #ffffff;
/*background: red;*/
}
.fontInner span b{
display: inline-block;
width: .2rem;
height: .2rem;
border-radius: 0.03rem;
color: #ffffff;
line-height: .2rem;
}
\ No newline at end of file
/*
头部*/
.header{
width: 100%;
height: 1.5rem;
/*background: red;*/
}
.header .header-left{
width: 25%;
height: 1.05rem;
color: white;
/* border: 1px solid green;*/
text-align: center;
line-height: 1.05rem;
}
.header .header-center{
width: 50%;
height: 1.2rem;
/*border: 1px solid red;*/
/* background: url("../images/head.gif") no-repeat;
background-size: 100% 100%;*/
position: relative;
}
.header .header-center .header-title{
text-align: center;
color: #ffffff;
font-size: .4rem;
text-shadow: 0 0 .3rem #00d8ff;
line-height: 1.05rem;
}
.header .header-img{
background: url("../images/head.gif") no-repeat center center;
background-size: 100%;
height: 100%;
width: 100%;
position: absolute;
top: .4rem;
}
.header .header-right{
width: 25%;
height: 1.05rem;
/*border: 1px solid gold;*/
}
.header .header-bottom{
width: calc(100% - .4rem);
height: .16rem;
background: url("../images/header.png") no-repeat;
background-size: calc(100% - .2rem) 100%;
padding: 0 .2rem;
margin-left: .3rem;
}
.center{
padding: .1rem .2rem .1rem .2rem;
}
.center .center-left{
width: calc(45% - .1rem);
padding: .1rem;
}
.center .center-left .center-left-cen{
width: 100%;
height: 10.4rem;
}
.center-left-cen-left{
width: calc(35% - .2rem);
height: 5rem;
/* border: 1px solid red;*/
}
.center-left-cen-right{
width: calc(65% - .2rem);
height: 4.8rem;
/* border: 1px solid red;*/
margin: .2rem .2rem 0 .2rem;
}
.center-left-cen-top1{
width: calc(100% - .2rem);
height: 2.3rem;
margin: .2rem;
}
.center-left-cen-top2{
width: calc(100% - .2rem);
height: 2.3rem;
margin: 0 0 0 .2rem;
}
.center-left-zhong{
width: calc(100% - .4rem);
height: 2.4rem;
margin: .2rem;
}
.center-left-zhong-left{
width: 40%;
height: 100%;
/*border: 1px solid red;*/
padding: 10px;
}
.center-left-zhong-right{
width: 60%;
height: 100%;
/*border: 1px solid red;*/
padding: 10px 15px;
}
.center-left-bottm{
width: calc(100% - .4rem);
height: 2.4rem;
margin: 0 .2rem .2rem .2rem;
}
/*右边*/
.center .center-right{
width: 55%;
padding: .1rem;
}
.center .center-right .center-right-top{
width: 100%;
height: 3rem;
margin-bottom: .4rem;
}
.center-right-cen-left{
width: calc(65% - .4rem);
height: 3rem;
padding: 0.1rem;
}
.center-right-cen-right{
width: 35%;
height: 3.2rem;
}
.center-right-bottom{
width: 100%;
height: 3.4rem;
margin-top: .4rem;
}
\ No newline at end of file
body{
margin: 0;
padding: 0;
background: url('../../images/dashboard/bg.png');
background-repeat: no-repeat;
background-attachment:fixed;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/background.jpg', sizingMethod='scale');
-ms-filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/background.jpg', sizingMethod='scale');
background-size: cover;
-moz-background-size: cover;
-webkit-background-size: cover;
}
li{
list-style: none;
}
.header{
width: 700px;
margin: 0 auto;
}
.header p.p1{
width: 60px;
height: 60px;
margin: 0 auto;
margin-top: 110px;
}
.header p.p2{
height: 40px;
margin: 0 auto;
text-align: center;
line-height: 40px;
margin-top: 10px;
font-size: 20px;
color: #fec468;
}
.header p.p3{
height: 40px;
margin: 0 auto;
text-align: center;
line-height: 40px;
font-size: 28px;
color: #bddde6;
}
.contain{
width: 1210px;
margin: 0 auto;
margin-top: 80px;
height: 400px;
}
.contain ul li img{
display: inline-block;
margin-left: -45px;
}
.contain ul li span{
display: inline-block;
vertical-align:16px;
font-size: 30px;
color: #57daff;
margin-left: 20px;
}
.contain ul{
width: 100%;
height: 100%;
}
.contain ul li{
width: 600px;
height: 200px;
line-height: 210px;
float: left;
background-image: url('../images/kuang.png');
background-position: center center;
background-repeat: no-repeat;
margin-bottom: 50px;
background-color:transparent;
}
.contain ul li:hover{
background: url('../images/chooseKuang.png') center center no-repeat;
/*background-color: -webkit-linear-gradient(red, blue); /* Safari 5.1 - 6.0 */
/*background-color: -o-linear-gradient(red, blue); /* Opera 11.1 - 12.0 */
/*background-color: -moz-linear-gradient(red, blue); /* Firefox 3.6 - 15 */
/*background-color: linear-gradient(red, blue); /* 标准的语法 */
}
.contain ul li a{
display: block;
width: 100%;
height: 100%;
text-align: center;
}
.footer{
width: 400px;
position: fixed;
bottom: 30px;
left: 50%;
transform: translateX(-200px);
text-align: center;
color: #6d95aa;
}
.footer span{
vertical-align:top;
}
......@@ -9,6 +9,9 @@
background-size: cover;
-moz-background-size: cover;
-webkit-background-size: cover;
width: 100%;
height: 100%;
overflow: hidden;
}
.kmesweb-dashboard .header{
width: 700px;
......@@ -46,6 +49,7 @@
.kmesweb-dashboard .contain ul li img{
display: inline-block;
margin-left: -45px;
margin-top: -45px;
}
.kmesweb-dashboard .contain ul li span{
display: inline-block;
......
*{
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box}
*,body{padding:0px; margin:0px;color: #ffffff;/*font-family: "微软雅黑";*/}
html,body{
background: url("../../images/dashboard/bg.png") no-repeat;
background-size: cover;
font-size: .16rem;
color: #ffffff;
position: relative;
width: 100%;
height: 100%;
font-family: myFirstFont !important;
}
.fl{
float: left;
}
.fr{
float: right;
}
ul,ol{
list-style: none;
}
.allnav{
height: 100%;
}
@font-face
{
font-family: myFirstFont;
src: url('DISPLAY FREE TFB.ttf')
}
/*谷哥滚动条样式*/
::-webkit-scrollbar {width:5px;height:5px;position:absolute}
::-webkit-scrollbar-thumb {background-color:#5bc0de}
::-webkit-scrollbar-track {background-color:#ddd}
/***/
.allnav{
height: 100%;
}
/*第三栏头部*/
.rightTop{
width: 100%;
height: 450px;
position: relative;
border:1px solid #0bc4e9;
background: rgba(0,72,115,0.28);
transition: all 1s;
cursor: pointer;
}
/*边框公共样式*/
.border:before{
content: '';
position: absolute;
width: 80%;
height: 100%;
bottom: -1px;
top:-1px;
left:10%;
border-bottom: 1px solid #007297;
border-top: 1px solid #007297;
transition: all 0.5s;
}
.border:after{
content: '';
position: absolute;
width: 100%;
height: 80%;
left: -1px;
right:-1px;
top:10%;
border-left: 1px solid #007297;
border-right: 1px solid #007297;
transition: all 0.5s;
}
.border:hover::before{
width: 0%;
}
.border:hover::after{
height: 0%;
}
.border:hover{
box-shadow:-5px 0px 2px rgba(255,255,255,0.1), /*左边阴影*/ 0px -5px 2px rgba(255,255,255,0.1), /*上边阴影*/ 5px 0px 2px rgba(255,255,255,0.1), /*右边阴影*/ 0px 5px 2px rgba(255,255,255,0.1);
/*background: rgba(255,255,255,0.1);*/
}
.border h4{
margin: 15px 0 5px 20px;
color: #8adeff;
line-height: 35px;
font-size: 18px;
font-weight: 500;
}
/* 鼠标特效 */
*{
cursor: url(../../images/dashboard/pointer.png) 8 3, auto !important;
}
\ No newline at end of file
/*头部*/
.header{
width: 100%;
height: 1.5rem;
/*background: red;*/
}
.header .header-left{
width: 25%;
height: 1.05rem;
color: white;
/* border: 1px solid green;*/
text-align: center;
line-height: 1.05rem;
}
.header .header-center{
width: 50%;
height: 1.2rem;
/*border: 1px solid red;*/
/* background: url("../images/head.gif") no-repeat;
background-size: 100% 100%;*/
position: relative;
}
.header .header-center .header-title{
text-align: center;
color: #ffffff;
font-size: .4rem;
text-shadow: 0 0 .3rem #00d8ff;
line-height: 1.05rem;
}
.header .header-img{
background: url("../images/head.gif") no-repeat center center;
background-size: 100%;
height: 100%;
width: 100%;
position: absolute;
top: .4rem;
}
.header .header-right{
width: 25%;
height: 1.05rem;
/*border: 1px solid gold;*/
}
.header .header-bottom{
width: calc(100% - .4rem);
height: .16rem;
background: url("../images/header.png") no-repeat;
background-size: calc(100% - .2rem) 100%;
padding: 0 .2rem;
margin-left: .3rem;
}
/*
内容*/
.center{
padding: .1rem .2rem .1rem .2rem;
}
.center .center-left{
width: 30%;
padding: .1rem;
/* border: 1px solid red;*/
}
.center .center-left .left-top{
width: 100%;
height: 1.8rem;
margin-bottom: .4rem;
/*background: url("../images/panel.png") no-repeat;
background-size: 100% 100%;*/
/*transform-style: preserve-3d;*/
/* border: 0.01rem solid #217093;
position: relative;
overflow: hidden;*/
}
.center .center-left .left-top h1{
color: white;
font-size: .4rem;
transform: rotateX(0deg);
/*display: flex;*/
align-items: center;
margin-bottom: 8px;
position: relative;
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
-ms-transform-style: preserve-3d;
transform-style: preserve-3d;
transform-origin: 50% 50%;
/*transform: rotateX(0deg);*/
/*width: 100%;*/
transition: transform 500ms cubic-bezier(0.15, 0.52, 0.5, 0.9) 0s;
/*height: 24px;*/
/*过渡效果*/
transition: all 1s;
}
/*.center .center-left .left-top h1:hover{
transform: rotateX(360deg);
transition: all 2s;
}*/
.title{
width: 90%;
height: 0.3rem;
/* border: 1px solid gold;*/
position: relative;
top:.1rem;
left: .25rem;
color: white;
padding-left: 0.12rem;
line-height: 0.3rem;
}
.title:before{
width: 0.05rem;
height: 0.25rem;
top: 0.02rem;
position: absolute;
content: "";
background: #59ebe8;
border-radius: 0.02rem;
left: 0;
}
.top-list{
margin-top: .3rem;
padding-left: 2%;
width: calc(100% - .2rem);
}
.top-list span{
display: inline-block;
text-align: center;
padding: 0px 3%;
color: #08faf6;
letter-spacing: 1px;
}
.top-list span p{
line-height: .3rem;
color: #fff;
}
.center .center-left .left-cen{
width: 100%;
height: 2.4rem;
margin-bottom: .4rem;
/*background: url("../images/panel.png") no-repeat;
background-size: 100% 100%;*/
/*border: 0.01rem solid #217093;*/
}
.center .center-left .left-cen .banner{
width: calc(100% - .2rem);
height: calc(100% - .6rem);
margin-left: .1rem;
margin-top: .1rem;
padding: .1rem;
box-sizing: border-box;
overflow: hidden;
}
.center .center-left .left-cen .banner ul{
/*width: calc(100% - .2rem) !important;*/
height: 100%;
}
.center .center-left .left-cen .banner li{
color: white !important;
width: 6rem;
float:left;
height: 100%;
margin-top: .1rem;
}
.center .center-left .left-cen .banner li .list{
color: white !important;
width: 100%;
float:left;
height: 100%;
}
.center .center-left .left-cen .banner li .list .listTxt{
color: white !important;
/*width: 80%;*/
float:left;
height: 100%;
}
.center .center-left .left-cen .banner li .list .listTxt p{
color: #a9e2ff;
font-size: 14px;
line-height: 25px;
}
.center .center-left .left-cen .banner li .list .listImg{
color: white !important;
/*width: 20%;*/
float:left;
height: 100%;
}
.center .center-left .left-cen .banner li .list .listImg img{
width: .6rem;
height: .6rem;
}
/*.center .center-left .left-cen .company .wodryRX0 span{
background: red;
}*/
.center .center-left .left-bottom{
width: 100%;
height: 3.2rem;
margin-bottom: .4rem;
/*background: url("../images/panel.png") no-repeat;
background-size: 100% 100%;*/
/*border: 0.01rem solid #217093;*/
}
.center .center-left .bottom-b{
width: calc(100% - 0.2rem);
height: 2.6rem;
margin-left: 0.1rem;
margin-top: 0.1rem;
}
.center .center-cen{
width: 40%;
padding: .1rem;
}
.center .center-cen .cen-top{
width: 100%;
height: 6.8rem;
/*background: url("../images/a.png") no-repeat;
background-size: 100% 100%;*/
/*border: 0.01rem solid #217093;*/
margin-bottom: .4rem;
position: relative;
}
.center .center-cen .cen-top .top-title{
position: absolute;
width: 35%;
height: 1.5rem;
/*border: 1px solid red;*/
left: .5rem;
top:.5rem;
}
.center .center-cen .cen-top .top-title li{
float: left;
width: 50%;
height: 1rem;
/*border: 1px solid green;*/
}
.center .center-cen .cen-top .top-title li p,
.center .center-cen .cen-top .top-title li span,
.center .center-cen .cen-top .top-title li b{
color: #ffffff;
}
.center .center-cen .cen-top .top-title li p{
padding: .1rem;
}
.center .center-cen .cen-top .top-title li span{
text-align: center;
display: inline-block;
width: .35rem;
height: .45rem;
background: #37a9ea;
margin-left: .1rem;
line-height: .4rem;
font-size: .3rem;
margin-top: .1rem;
}
.center .center-cen .cen-top .top-bottom{
width: 100%;
height: 4.8rem;
/*border: 1px solid red;*/
position: absolute;
top:1.6rem;
padding: .2rem;
/*overflow: hidden;*/
}
.center .center-cen .cen-bottom{
width: 100%;
height: 3.2rem;
/*border: 0.01rem solid #217093;*/
}
.center .center-cen .bottom-b{
width: calc(100% - 0.2rem);
height: 2.6rem;
margin-left: 0.1rem;
margin-top: 0.1rem;
}
.center .center-right{
width: 30%;
padding: .1rem;
}
.center .center-right .right-top{
width: 100%;
height: 3.2rem;
margin-bottom: .4rem;
/*border: 0.01rem solid #217093;*/
}
.center .center-right .right-top .right-top-cent{
width: calc(100% - 0.2rem);
height: 2.6rem;
margin-left: 0.1rem;
margin-top: 0.1rem;
}
.center .center-right .right-cen{
width: 100%;
height: 3.2rem;
margin-bottom: .4rem;
/*border: 0.01rem solid #217093;*/
border:1px solid #0bc4e9;
background: rgba(0,72,115,0.28);
transition: all 1s;
cursor: pointer;
position: relative;
}
.center .center-right .right-cen .right-cen-cent{
width: calc(100% - 0.2rem);
height: 2.6rem;
margin-left: 0.1rem;
margin-top: 0.1rem;
}
.center .center-right .right-bottom{
width: 100%;
height: 3.2rem;
/*border: 0.01rem solid #217093;*/
}
.center .center-right .right-bottom .chat{
/* width: calc(100% - .2rem);
height: calc(100% - .6rem);
margin-top: .1rem;
margin-left: .1rem;
padding: .1rem;*/
width: calc(100% - 0.2rem);
height: 2.6rem;
margin-left: 0.1rem;
margin-top: 0.1rem;
/*overflow: hidden;*/
}
.popup{
width: 0;
height: 0;
/*background: #061f3e;*/
background: rgba(25,127,170,.9);
border: 1px solid #197faa;
margin: 40px auto 0;
box-shadow: 0px 0px 10px #197faa inset;
position: absolute;
top: 50%;
left: 50%;
z-index: 999;
border-radius: 8px;
display: block;
-webkit-transform: translate(-50%,-50%);
-moz-transform: translate(-50%,-50%);
-ms-transform: translate(-50%,-50%);
-o-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
}
.popup .popupClose{
display: block;
width: 44px;
height: 44px;
background: url(../images/s_ico3.png);
background-size: 100 100%;
position: absolute;
top: -22px;
right: -22px;
display: none;
transition: 0.3s;
}
.popup .popupClose:hover{
transform: rotate(180deg);
}
\ No newline at end of file
.adjecting {
display: inline-block;
position: relative;
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
-ms-transform-style: preserve-3d;
-o-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-transform-origin-x: 50%;
}
.adjecting .front-face, .adjecting .back-face {
display: inline-block;
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
-ms-backface-visibility: hidden;
-o-backface-visibility: hidden;
backface-visibility: hidden;
}
.adjecting .front-face {
position: absolute;
}
.adjecting .back-face {
position: relative;
}
This diff is collapsed.
// JavaScript Document
(function($){
$.fn.myScroll = function(options){
//默认配置
var defaults = {
speed:60, //滚动速度,值越大速度越慢
rowHeight:24 //每行的高度
};
var opts = $.extend({}, defaults, options),intId = [];
function marquee(obj, step){
obj.find("ul").animate({
marginTop: '-=1'
},0,function(){
var s = Math.abs(parseInt($(this).css("margin-top")));
if(s >= step){
$(this).find("li").slice(0, 1).appendTo($(this));
$(this).css("margin-top", 0);
}
});
}
this.each(function(i){
var sh = opts["rowHeight"],speed = opts["speed"],_this = $(this);
intId[i] = setInterval(function(){
if(_this.find("ul").height()<=_this.height()){
clearInterval(intId[i]);
}else{
marquee(_this, sh);
}
}, speed);
_this.hover(function(){
clearInterval(intId[i]);
},function(){
intId[i] = setInterval(function(){
if(_this.find("ul").height()<=_this.height()){
clearInterval(intId[i]);
}else{
marquee(_this, sh);
}
}, speed);
});
});
}
})(jQuery);
\ No newline at end of file
/* Sergey Golovin 2014 golovim@gmail.com */
(function() {
var a, b = {}.hasOwnProperty;
a = jQuery,
a.fn.extend({
wodry: function(c) {
var d, e, f, g, h;
return null == c && (c = {}),
e = a.extend({},
c),
null == e.separator && (e.separator = "|"),
null == e.delay && (e.delay = 2e3),
null == e.animationDuration && (e.animationDuration = 1000),
null == e.animation && (e.animation = "rotateY"),
null == e.callback && (e.callback = function() {}),
null == e.shift && (e.shift = {}),
null == (f = e.shift).x && (f.x = 0),
null == (g = e.shift).y && (g.y = 0),
null == (h = e.shift).z && (h.z = 0),
d = {
rotateY: {
front_transform: "translate3d(" + e.shift.x + "px," + e.shift.y + "px," + e.shift.z + "px)",
back_transform: "translate3d(" + e.shift.x + "px," + e.shift.y + "px," + e.shift.z + "px) rotateY(180deg)",
action: {
transform: " rotateY(180deg)",
transition: " " + e.animationDuration + "ms"
}
},
rotateX: {
front_transform: "translate3d(" + e.shift.x + "px," + e.shift.y + "px," + e.shift.z + "px)",
back_transform: "translate3d(" + e.shift.x + "px," + e.shift.y + "px," + e.shift.z + "px) rotateX(180deg)",
action: {
transform: " rotateX(180deg)",
transition: " " + e.animationDuration + "ms"
}
},
rotateAll: {
isCoplex: !0,
front_transform: "translate3d(" + e.shift.x + "px," + e.shift.y + "px," + e.shift.z + "px) rotateX(180deg) rotateY(180deg)",
back_transform: "translate3d(" + e.shift.x + "px," + e.shift.y + "px," + e.shift.z + "px) rotateX(180deg) rotateY(180deg)",
action: {
transform: " rotateX(180deg) rotateY(180deg)",
transition: " " + e.animationDuration + "ms"
}
},
scaleX: {
isCoplex: !0,
front_transform: "translate3d(" + e.shift.x + "px," + e.shift.y + "px," + e.shift.z + "px) scaleX(0.1)",
back_transform: "translate3d(" + e.shift.x + "px," + e.shift.y + "px," + e.shift.z + "px) scaleX(0.1)",
action: {
transform: " scaleX(10)",
transition: " " + e.animationDuration + "ms"
}
},
scaleY: {
isCoplex: !0,
front_transform: "translate3d(" + e.shift.x + "px," + e.shift.y + "px," + e.shift.z + "px) scaleY(0.1)",
back_transform: "translate3d(" + e.shift.x + "px," + e.shift.y + "px," + e.shift.z + "px) scaleY(0.1)",
action: {
transform: " scaleY(10)",
transition: " " + e.animationDuration + "ms"
}
},
scaleAll: {
isCoplex: !0,
front_transform: "translate3d(" + e.shift.x + "px," + e.shift.y + "px," + e.shift.z + "px) scaleY(0.1) slaleX(0.1)",
back_transform: "translate3d(" + e.shift.x + "px," + e.shift.y + "px," + e.shift.z + "px) scaleY(0.1) scaleX(0.1)",
action: {
transform: " scaleY(10) scaleX(10)",
transition: " " + e.animationDuration + "ms"
}
},
anticlockwise: {
isCoplex: !0,
front_transform: "translate3d(" + e.shift.x + "px," + e.shift.y + "px," + e.shift.z + "px) rotate3d(100,40,-80,180deg)",
back_transform: "translate3d(" + e.shift.x + "px," + e.shift.y + "px," + e.shift.z + "px) rotate3d(100,40,-80,180deg)",
action: {
transform: " rotate3d(100,40,-80,180deg)",
transition: " " + e.animationDuration + "ms"
}
},
clockwise: {
isCoplex: !0,
front_transform: "translate3d(" + e.shift.x + "px," + e.shift.y + "px," + e.shift.z + "px) rotate3d(40,100,80,180deg)",
back_transform: "translate3d(" + e.shift.x + "px," + e.shift.y + "px," + e.shift.z + "px) rotate3d(40,100,80,180deg)",
action: {
transform: " rotate3d(40,100,80,180deg)",
transition: " " + e.animationDuration + "ms"
}
}
},
this.each(function() {
var c, f, g, h, i;
return h = a(this),
f = [],
a.each(h.text().split(e.separator),
function(a, b) {
return f.push(b)
}),
h.text(f[0]),
i = function(a, c) {
var d, e, f, g, h, i, j, k, l, m, n;
for (i = {},
g = {},
l = 0, m = a.length; m > l; l++) h = a[l],
d = a.indexOf(h),
g[h] = c[d];
if (a.length === c.length) {
for (h in g) b.call(g, h) && (j = g[h], n = ["-webkit-" + h, "-moz-" + h, "-o-" + h], k = n[0], e = n[1], f = n[2], i[k] = j, i[e] = j, i[f] = j, i[h] = j);
return i
}
},
c = function(b, c, d, e) {
return c.html(""),
a("<span class='front-face'>" + d + "</span>").appendTo(c),
a("." + c.context.className + " .front-face").css(i(["transform"], [b.front_transform])),
a("<span class='back-face'>" + e + "</span>").appendTo(c),
a("." + c.context.className + " .back-face").css(i(["transform"], [b.back_transform])),
c.wrapInner("<span class='adjecting' />").find(".adjecting").hide().show().css(i(["transform", "transition"], [b.action.transform, b.action.transition])),
b.isCoplex ? setTimeout(function() {
return a("." + c.context.className + " .front-face").remove()
},
1) : void 0
},
g = function() {
var b, g;
return h.find(".back-face").length > 0 && h.html(h.find(".back-face").html()),
g = h.text(),
b = a.inArray(g, f),
b + 1 === f.length && (b = -1),
c(d[e.animation], h, g, f[b + 1])
},
setInterval(function() {
return g()
//e.callback()
},
e.delay + e.animationDuration)
})
}
})
}).call(this);
//# sourceMappingURL=wodry.min.map
<link rel="stylesheet" href="css/dashboard/mian.css">
<div class="gui-div kmesweb-dashboard" id="kmesDashboard">
<div class="kmesweb-dashboard" id="kmesDashboard">
<div id="navigation">
<div class="header">
<p class="p1">
......@@ -11,7 +11,7 @@
<div class="contain">
<ul>
<li>
<a href="bigdata.html" target="_blank">
<a href="kmes/dashboard/first" target="_blank">
<img src="images/dashboard/jinrong.png" alt="">
<span>展示效果一</span>
</a>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment