提交首页修改
@@ -0,0 +1 @@
|
||||
*{padding:0;margin:0;box-sizing:border-box}li,ol{list-style:none}a{text-decoration:none}@font-face{font-family:"方正大黑_GBK";src:url("../font/方正大黑_GBK.eot?") format("eot");src:url("../font/方正大黑_GBK.woff") format("woff"),url("../font/方正大黑_GBK.ttf") format("truetype")}@font-face{font-family:"液晶数字";src:url("../font/液晶数字.eot?") format("eot");src:url("../font/液晶数字.woff") format("woff"),url("../font/液晶数字.ttf") format("truetype")}::-webkit-scrollbar{width:5px;height:5px;background-color:transparent}::-webkit-scrollbar-track{-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,0.3);border-radius:10px;background-color:#6b81d4}::-webkit-scrollbar-thumb{border-radius:10px;-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,0.3);background-color:#1843e2}::-webkit-scrollbar-thumb:hover{border-radius:5px;-webkit-box-shadow:inset 0 0 5px rgba(0,0,0,0.2);background:rgba(0,0,0,0.4)}html{scrollbar-face-color:#071857;scrollbar-highlight-color:#010a2c;scrollbar-3dlight-color:#010a2c;scrollbar-darkshadow-color:#010a2c;scrollbar-shadow-color:#071857;scrollbar-arrow-color:rgba(1,10,44,0.4);scrollbar-track-color:#071857}html{font-size:10vw;width:100%;height:100%;min-width:1200px;font-family:Microsoft YaHei;line-height:1}@media screen and (max-width: 1200px){html{font-size:120px}}.ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.flex-1{flex:1}.dis-flex{display:flex}body{background:#dfe4f1}.logo-wrap{position:absolute;left:0;right:0;top:0;bottom:0;overflow:hidden;overflow-x:hidden;overflow-y:hidden;background:url("../image/bj1.png") no-repeat center center;_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../image/bj1.png');background-size:cover;_background:none}.logo-wrap .logo-top{width:1.19271rem;height:.29688rem;position:absolute;top:.20833rem;left:.15625rem}.logo-wrap .logo-top img{display:block;width:1.19271rem;height:.29688rem}.logo-wrap .logo-main{position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);width:6.25rem;height:3.22917rem;background-color:#fefefe;box-shadow:0px 0px .15625rem .02604rem rgba(0,0,0,0.4)}.logo-wrap .logo-main .left-content{width:3.125rem;height:3.22917rem}.logo-wrap .logo-main .left-content img{display:block;width:3.125rem;height:3.22917rem}.logo-wrap .logo-main .right-content{padding:.41667rem .41667rem}.logo-wrap .logo-main .right-content .logo{margin-bottom:.36458rem;width:2.39583rem}.logo-wrap .logo-main .right-content .logo img{display:block;width:2.39583rem;height:auto}.logo-wrap .logo-main .right-content .icon img{display:block;width:.15625rem;height:auto}.logo-wrap .logo-main .right-content .login-main{margin-bottom:.41667rem}.logo-wrap .logo-main .right-content .login-main .login-layout{display:flex;height:.29167rem;border:1px solid #969696;padding:.05208rem .07813rem;margin-bottom:.26042rem}.logo-wrap .logo-main .right-content .login-main .login-layout-two{margin-bottom:.20833rem}.logo-wrap .logo-main .right-content .login-main .input-text{padding-left:.07813rem}.logo-wrap .logo-main .right-content .login-main input{border:none;outline:0;background-color:transparent;padding:0;margin:0;width:100%;height:100%}.logo-wrap .logo-main .right-content .login-main input:focus{border:none}.logo-wrap .logo-main .right-content .login-main .login-help{display:flex;align-items:center;justify-content:space-between;font-size:.08333rem}.logo-wrap .logo-main .right-content .login-main .login-help .login-help-left{display:flex;cursor:pointer}.logo-wrap .logo-main .right-content .login-main .login-help .login-help-left .checkbox{width:.11458rem}.logo-wrap .logo-main .right-content .login-main .login-help .login-help-left .checkbox .basic-check{width:.09375rem;height:.09375rem;position:relative}.logo-wrap .logo-main .right-content .login-main .login-help .login-help-left .checkbox .basic-check .checkbox-content{width:.08333rem;height:.08333rem;color:#107f8b;border-radius:2px;border:1px solid #107f8b}.logo-wrap .logo-main .right-content .login-main .login-help .login-help-left .checkbox .basic-check .checkbox-content::after{position:absolute;display:table;top:35%;left:20%;border:2px solid transparent;border-top:0;border-left:0;width:4px;height:8px;transform:rotate(45deg) scale(1) translate(-50%, -50%);content:''}.logo-wrap .logo-main .right-content .login-main .login-help .login-help-left .checkbox .basic-check .checkbox-content.active::after{border-color:#107f8b;opacity:1}.logo-wrap .logo-main .right-content .login-btn{cursor:pointer;background-color:#107f8b;color:#fff;font-size:.08333rem;display:flex;justify-content:center;align-items:center;width:2.39583rem;height:.25rem;border-radius:.125rem}
|
||||
@@ -0,0 +1,970 @@
|
||||
*
|
||||
{
|
||||
box-sizing:border-box;
|
||||
margin:0;
|
||||
padding:0;
|
||||
}
|
||||
|
||||
li,ol
|
||||
{
|
||||
list-style:none;
|
||||
}
|
||||
|
||||
a
|
||||
{
|
||||
text-decoration:none;
|
||||
}
|
||||
|
||||
@font-face
|
||||
{
|
||||
font-family:液晶数字;
|
||||
src:url(../font/液晶数字.woff) format(woff),url(../font/液晶数字.ttf) format(truetype);
|
||||
}
|
||||
|
||||
::-webkit-scrollbar
|
||||
{
|
||||
width:5px;
|
||||
height:5px;
|
||||
background-color:transparent;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track
|
||||
{
|
||||
-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,0.3);
|
||||
border-radius:10px;
|
||||
background-color:#6b81d4;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb
|
||||
{
|
||||
border-radius:10px;
|
||||
-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,0.3);
|
||||
background-color:#1843e2;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover
|
||||
{
|
||||
border-radius:5px;
|
||||
-webkit-box-shadow:inset 0 0 5px rgba(0,0,0,0.2);
|
||||
background:rgba(0,0,0,0.4);
|
||||
}
|
||||
|
||||
html
|
||||
{
|
||||
scrollbar-face-color:#071857;
|
||||
scrollbar-highlight-color:#010a2c;
|
||||
scrollbar-3dlight-color:#010a2c;
|
||||
scrollbar-darkshadow-color:#010a2c;
|
||||
scrollbar-shadow-color:#071857;
|
||||
scrollbar-arrow-color:rgba(1,10,44,0.4);
|
||||
scrollbar-track-color:#071857;
|
||||
font-size:10vw;
|
||||
width:100%;
|
||||
height:100%;
|
||||
min-width:1200px;
|
||||
font-family:Microsoft YaHei;
|
||||
line-height:1;
|
||||
background: rgb(14,17,60);
|
||||
}
|
||||
|
||||
.ellipsis
|
||||
{
|
||||
overflow:hidden;
|
||||
text-overflow:ellipsis;
|
||||
white-space:nowrap;
|
||||
}
|
||||
|
||||
.flexCenter
|
||||
{
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
}
|
||||
|
||||
.flexCenterV
|
||||
{
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
flex-direction:column;
|
||||
}
|
||||
|
||||
.sd-index1-body
|
||||
{
|
||||
background:#010817;
|
||||
background-image:url(../image/index1/bj.png);
|
||||
background-position:center center;
|
||||
background-size:100% 100%;
|
||||
background-repeat:no-repeat;
|
||||
}
|
||||
|
||||
.sd-header
|
||||
{
|
||||
position:relative;
|
||||
width:100%;
|
||||
height:.30729rem;
|
||||
background:url(../image/index1/header-bg.png) center center/100% 100% no-repeat;
|
||||
padding:0 .10417rem;
|
||||
}
|
||||
|
||||
.sd-header .sd-header-title
|
||||
{
|
||||
position:absolute;
|
||||
top:.03646rem;
|
||||
left:50%;
|
||||
transform:translate(-50%);
|
||||
font-size:.16667rem;
|
||||
color:#0FF;
|
||||
white-space:nowrap;
|
||||
}
|
||||
|
||||
.sd-header .sd-header-top .sd-header-top-left
|
||||
{
|
||||
position:absolute;
|
||||
left:.10417rem;
|
||||
top:.05208rem;
|
||||
color:#1ab1ff;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
}
|
||||
|
||||
.sd-header .sd-header-top .sd-header-top-left .sd-location-name
|
||||
{
|
||||
margin-right:.09375rem;
|
||||
}
|
||||
|
||||
.sd-header .sd-header-top .sd-header-top-right
|
||||
{
|
||||
position:absolute;
|
||||
top:.03646rem;
|
||||
right:0;
|
||||
}
|
||||
|
||||
.sd-header .sd-header-top .sd-header-top-right .sd-location-time
|
||||
{
|
||||
font-size:.0625rem;
|
||||
color:#B0E1FF;
|
||||
}
|
||||
|
||||
.sd-body
|
||||
{
|
||||
height:5.20833rem;
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
padding:0 .10417rem .09375rem;
|
||||
padding:.1rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .bg
|
||||
{
|
||||
background:rgba(1,20,56,0.7);
|
||||
border:1px solid #173762;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-left .stl-top
|
||||
{
|
||||
width:100%;
|
||||
height:2.21354rem;
|
||||
margin-bottom:.10417rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-left .stl-top .rightGap::before
|
||||
{
|
||||
content:'';
|
||||
background:url(../image/index1/spline.png) center center/100% 100%;
|
||||
position:absolute;
|
||||
top:0;
|
||||
right:0;
|
||||
width:.00521rem;
|
||||
height:.21875rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-left .stl-top .stl-top-tw
|
||||
{
|
||||
width:1.14583rem!important;
|
||||
margin-right:.05208rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-left .stl-top .stl-top-tw .i-tit-w
|
||||
{
|
||||
width:.625rem!important;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-left .stl-top .stl-top-cw
|
||||
{
|
||||
width:1.70833rem!important;
|
||||
margin-right:.05208rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-left .stl-top .stl-top-cw1
|
||||
{
|
||||
width:.58333rem!important;
|
||||
margin-right:.05208rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-left .stl-top .stl-top-cw1 .i-tit-w1
|
||||
{
|
||||
width:.41667rem!important;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-left .stl-top .content
|
||||
{
|
||||
padding:.10417rem .07813rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-left .stl-top .content .item .i-item
|
||||
{
|
||||
background-color:#051A40;
|
||||
width:2.34375rem;
|
||||
height:.55208rem;
|
||||
padding:.07292rem 0 .09896rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-left .stl-top .content .item .i-item .i-tit
|
||||
{
|
||||
width:.52083rem;
|
||||
color:#4B87D6;
|
||||
font-size:.07292rem;
|
||||
text-align:center;
|
||||
position:relative;
|
||||
margin:0 auto .07292rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-left .stl-top .content .item .i-item .i-tit::after
|
||||
{
|
||||
content:'';
|
||||
background:url(../image/index1/arrL.png) center center/100% 100%;
|
||||
position:absolute;
|
||||
top:50%;
|
||||
left:0;
|
||||
transform:translate(0,-50%);
|
||||
width:.0625rem;
|
||||
height:.0625rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-left .stl-top .content .item .i-item .i-tit::before
|
||||
{
|
||||
content:'';
|
||||
background:url(../image/index1/arrR.png) center center/100% 100%;
|
||||
position:absolute;
|
||||
top:50%;
|
||||
right:0;
|
||||
transform:translate(0,-50%);
|
||||
width:.0625rem;
|
||||
height:.0625rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-left .stl-top .content .item .i-item .i-content
|
||||
{
|
||||
flex:1;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-left .stl-top .content .item .i-item .i-content .num
|
||||
{
|
||||
color:#0FF;
|
||||
font-size:.125rem;
|
||||
margin-bottom:.05208rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-left .stl-top .content .item .i-item .i-content .desc
|
||||
{
|
||||
color:#FFF;
|
||||
font-size:.0625rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-left .stl-bottom
|
||||
{
|
||||
width:100%;
|
||||
height:1.25rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-left .stl-bottom .aqhysj-wrap .aqhysj
|
||||
{
|
||||
width:2.21875rem;
|
||||
height:.79167rem;
|
||||
background:url(../image/index1/aqhysj.png) center center/100% 100% no-repeat;
|
||||
font-size:0;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-left .stl-bottom .aqhysj-wrap .aqhysj .item
|
||||
{
|
||||
display:inline-block;
|
||||
width:50%;
|
||||
height:.39583rem;
|
||||
position:relative;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-left .stl-bottom .aqhysj-wrap .aqhysj .item .desc
|
||||
{
|
||||
color:#fff;
|
||||
font-size:.07292rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-left .stl-bottom .aqhysj-wrap .aqhysj .item .desc1pos
|
||||
{
|
||||
position:absolute;
|
||||
left:.23438rem;
|
||||
top:-.03125rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-left .stl-bottom .aqhysj-wrap .aqhysj .item .desc2pos
|
||||
{
|
||||
position:absolute;
|
||||
right:.23438rem;
|
||||
top:-.03125rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-left .stl-bottom .aqhysj-wrap .aqhysj .item .desc3pos
|
||||
{
|
||||
position:absolute;
|
||||
left:.23438rem;
|
||||
bottom:-.03125rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-left .stl-bottom .aqhysj-wrap .aqhysj .item .desc4pos
|
||||
{
|
||||
position:absolute;
|
||||
right:.23438rem;
|
||||
bottom:-.03125rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-center
|
||||
{
|
||||
width:4.76563rem;
|
||||
height:3.56771rem;
|
||||
padding:0 .10417rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-center .stc-top .i-item
|
||||
{
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:space-between;
|
||||
width:1.01563rem;
|
||||
height:.36458rem;
|
||||
background:url(../image/index1/c-bg.png) center center/100% 100% no-repeat;
|
||||
font-size:0;
|
||||
margin-right:.17708rem;
|
||||
padding:0 .10417rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-center .stc-top .i-item .desc
|
||||
{
|
||||
font-size:.08333rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-center .stc-top .i-item .desc-cl2
|
||||
{
|
||||
color:#FFA600;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-center .stc-center .sd-body-map .sd-body-map-switch-btn
|
||||
{
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
position:absolute;
|
||||
top:0;
|
||||
right:0;
|
||||
z-index:99999;
|
||||
width:.84896rem;
|
||||
height:.23438rem;
|
||||
background:url(../image/index1/map-switch-btn-bg.png) center center/100% 100% no-repeat;
|
||||
font-size:.08333rem;
|
||||
color:#1ab1ff;
|
||||
cursor:pointer;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-center .stc-center .sd-body-map .sd-map
|
||||
{
|
||||
width:100%;
|
||||
height:2.05729rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-center .stc-bottom .i-item
|
||||
{
|
||||
color:#7ECEF7;
|
||||
font-size:.07292rem;
|
||||
width:1.38542rem;
|
||||
margin-right:.20052rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-center .stc-bottom .i-item .ii-desc
|
||||
{
|
||||
width:1.38542rem;
|
||||
text-align:center;
|
||||
margin-bottom:.04167rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-center .stc-bottom .i-item .ii-item
|
||||
{
|
||||
margin-bottom:.05729rem;
|
||||
width:1.38542rem;
|
||||
height:.23438rem;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:space-between;
|
||||
color:#fff;
|
||||
padding:0 .07292rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-center .stc-bottom .i-item .ii-item.bg1
|
||||
{
|
||||
border:1px solid rgba(11,64,91,0.8);
|
||||
background:rgba(11,64,91,0.5);
|
||||
box-shadow:0 0 .01563rem .01563rem rgba(11,64,91,0.8);
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-center .stc-bottom .i-item .ii-item.bg2
|
||||
{
|
||||
border:1px solid rgba(97,14,31,0.8);
|
||||
background:rgba(97,14,31,0.5);
|
||||
box-shadow:0 0 .01563rem .01563rem rgba(97,14,31,0.8);
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-center .stc-bottom .i-item .ii-item.bg3
|
||||
{
|
||||
border:1px solid rgba(13,74,60,0.8);
|
||||
background:rgba(13,74,60,0.5);
|
||||
box-shadow:0 0 .01563rem .01563rem rgba(13,74,60,0.8);
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-center .stc-bottom .i-item .ii-item.bg4
|
||||
{
|
||||
border:1px solid rgba(22,39,93,0.8);
|
||||
background:rgba(22,39,93,0.5);
|
||||
box-shadow:0 0 .01563rem .01563rem rgba(22,39,93,0.8);
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-center .stc-bottom .i-item .ii-item.bg5
|
||||
{
|
||||
border:1px solid rgba(10,95,105,0.8);
|
||||
background:rgba(10,95,105,0.5);
|
||||
box-shadow:0 0 .01563rem .01563rem rgba(10,95,105,0.8);
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-center .stc-bottom .i-item .ii-item .num
|
||||
{
|
||||
color:#1AB1FF;
|
||||
font-size:.11458rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-right .str-top
|
||||
{
|
||||
height:1.22917rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-right .str-top .i-item
|
||||
{
|
||||
width:.66146rem;
|
||||
margin-right:.26042rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-right .str-top .i-item .tbMg
|
||||
{
|
||||
margin:.10417rem 0;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-right .str-top .i-item .i-txt
|
||||
{
|
||||
font-size:.07292rem;
|
||||
color:#7ECEF7;
|
||||
text-align:center;
|
||||
margin:0 auto;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-right .str-top .i-item .i-desc
|
||||
{
|
||||
width:.66146rem;
|
||||
height:.43229rem;
|
||||
background:rgba(11,32,86,0.5);
|
||||
box-shadow:0 0 .01563rem .01563rem rgba(11,32,86,0.8);
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-right .str-top .i-item .i-desc .id-txt
|
||||
{
|
||||
font-size:.07292rem;
|
||||
color:#FFF;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-right .str-top .i-item .i-desc .id-num
|
||||
{
|
||||
margin-top:.07813rem;
|
||||
font-size:.13542rem;
|
||||
color:#1AB1FF;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-right .str-top .i-item .i-desc .id-num-cl1
|
||||
{
|
||||
color:#12CDA2!important;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-right .str-top .i-item .i-desc .id-num-cl2
|
||||
{
|
||||
color:#6F6F6F!important;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-right .str-bottom
|
||||
{
|
||||
width:2.5rem;
|
||||
height:2.20833rem;
|
||||
margin-top:.13021rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-right .str-bottom .strb-top
|
||||
{
|
||||
margin:.10417rem 0 .14583rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-right .str-bottom .strb-top .strbt-left
|
||||
{
|
||||
width:1.04688rem;
|
||||
height:.83333rem;
|
||||
display:inline-block;
|
||||
margin:0 0 0 .1875rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-right .str-bottom .strb-top .strbt-left .sl-item
|
||||
{
|
||||
width:1.04688rem;
|
||||
height:.36458rem;
|
||||
background:url(../image/index1/zg.png) center center/100% 100% no-repeat;
|
||||
font-size:0;
|
||||
margin-bottom:.10417rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-right .str-bottom .strb-top .strbt-left .sl-item .desc
|
||||
{
|
||||
color:#A9DDEE;
|
||||
font-size:.07292rem;
|
||||
height:.18229rem;
|
||||
line-height:.18229rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-right .str-bottom .strb-top .strbt-left .sl-item .num,.sd-body .sd-body-top .sd-top-right .str-bottom .strb-top .strbt-left .sl-item .num1
|
||||
{
|
||||
font-size:.10417rem;
|
||||
color:#2BFAFF;
|
||||
height:.18229rem;
|
||||
line-height:.18229rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-right .str-bottom .strb-top .strbt-left .sl-item .num1
|
||||
{
|
||||
color:#FFA12F;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-right .str-bottom .strb-top .strbt-right
|
||||
{
|
||||
width:1.23438rem;
|
||||
height:.83333rem;
|
||||
position:relative;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-right .str-bottom .strb-top .strbt-right .strbt-right-pic
|
||||
{
|
||||
width:1.23438rem;
|
||||
height:.83333rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-right .str-bottom .strb-top .strbt-right .strbt-right-tit
|
||||
{
|
||||
position:absolute;
|
||||
bottom:0;
|
||||
left:50%;
|
||||
transform:translateX(-50%);
|
||||
width:.41667rem;
|
||||
height:.14583rem;
|
||||
background:rgba(25,80,158,0.5);
|
||||
border-radius:.07292rem;
|
||||
font-size:.08333rem;
|
||||
color:#00CAFF;
|
||||
margin:0 auto .02604rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-bottom
|
||||
{
|
||||
display:flex;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-bottom .bb-item
|
||||
{
|
||||
width:1.57813rem;
|
||||
height:1.44271rem;
|
||||
background:rgba(1,20,56,0.7);
|
||||
border:1px solid #173762;
|
||||
margin-right:.0625rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-bottom .bb-item .content
|
||||
{
|
||||
height:1.28646rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-bottom .bb-item .content .sgsjsj
|
||||
{
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
padding:.06771rem .07813rem .07813rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-bottom .bb-item .content .sgsjsj .sg-top
|
||||
{
|
||||
display:flex;
|
||||
height:.20313rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-bottom .bb-item .content .sgsjsj .sg-top .sg-top-item
|
||||
{
|
||||
/*width:.6875rem;*/
|
||||
background:rgba(15,45,88,0.5);
|
||||
margin-right:.04688rem;
|
||||
border:1px solid #0F2D58;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:space-between;
|
||||
color:#fff;
|
||||
font-size:.0625rem;
|
||||
padding:0 .10417rem 0 .07813rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-bottom .bb-item .content .sgsjsj .sg-top .sg-top-item:last-child
|
||||
{
|
||||
margin-left:0;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-bottom .bb-item .content .sgsjsj .sg-chart
|
||||
{
|
||||
width:100%;
|
||||
height:.92708rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-bottom .bb-item .content .sd-video-play
|
||||
{
|
||||
position:relative;
|
||||
width:1.56771rem;
|
||||
height:1.28646rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-bottom .bb-item .content .sd-video-play .sd-video
|
||||
{
|
||||
width:100%;
|
||||
height:100%;
|
||||
background:#000;
|
||||
object-fit:fill;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-bottom .bb-item .content .sd-video-play .sd-video-desc
|
||||
{
|
||||
position:absolute;
|
||||
left:0;
|
||||
bottom:0;
|
||||
width:100%;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:space-between;
|
||||
height:.13542rem;
|
||||
font-size:.0625rem;
|
||||
color:#7ECEF7;
|
||||
background:rgba(14,32,67,0.6);
|
||||
padding:0 .05729rem 0 .04167rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-bottom .bb-item .content .yjglsj
|
||||
{
|
||||
width:1.53125rem;
|
||||
height:1.22917rem;
|
||||
background:url(../image/index1/yjglsj.png) center center/100% 100% no-repeat;
|
||||
font-size:0;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-bottom .bb-item .content .yjglsj .item
|
||||
{
|
||||
display:inline-block;
|
||||
width:50%;
|
||||
height:.59375rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-bottom .bb-item .content .yjglsj .item .item-inner
|
||||
{
|
||||
height:100%;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-bottom .bb-item .content .yjglsj .item .item-inner .num
|
||||
{
|
||||
color:#1AB1FF;
|
||||
font-size:.15625rem;
|
||||
margin-bottom:.08854rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-bottom .bb-item .content .wdgcsj
|
||||
{
|
||||
width:1.47917rem;
|
||||
height:1.01563rem;
|
||||
background:url(../image/index1/wdgcsj.png) center center/100% 100% no-repeat;
|
||||
font-size:0;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-bottom .bb-item .content .wdgcsj .item
|
||||
{
|
||||
display:inline-block;
|
||||
width:50%;
|
||||
height:.59375rem;
|
||||
position:relative;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-bottom .bb-item .content .wdgcsj .item .leftPos
|
||||
{
|
||||
position:absolute;
|
||||
left:.05208rem;
|
||||
top:.07813rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-bottom .bb-item .content .wdgcsj .item .rightPos
|
||||
{
|
||||
position:absolute;
|
||||
right:.05208rem;
|
||||
top:.07813rem;
|
||||
text-align:right;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-bottom .bb-item .content .wdgcsj .item .item-inner .mgbS
|
||||
{
|
||||
margin-bottom:.05208rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-bottom .bb-item .content .wdgcsj .item .item-inner .numC1
|
||||
{
|
||||
color:#8656E8;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-center
|
||||
{
|
||||
flex:1;
|
||||
min-width:0;
|
||||
padding:0 .10417rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-center .sd-body-menus
|
||||
{
|
||||
font-size:0;
|
||||
display:flex;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-center .sd-body-menus .sd-body-menu
|
||||
{
|
||||
flex:1;
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
align-items:center;
|
||||
justify-content:flex-end;
|
||||
padding-bottom:.10417rem;
|
||||
height:.57292rem;
|
||||
background:url(../image/index1/center-menu-bg.png) center center/100% 100% no-repeat;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-center .sd-body-menus .sd-body-menu:not(:last-child)
|
||||
{
|
||||
margin-right:.08333rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-center .sd-body-menus .sd-body-menu .sd-body-menu-label
|
||||
{
|
||||
font-size:.07292rem;
|
||||
color:#1ab1ff;
|
||||
text-align:center;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-center .sd-body-menus .sd-body-menu .sd-body-menu-value
|
||||
{
|
||||
font-size:.1875rem;
|
||||
font-family:液晶数字;
|
||||
margin-top:.0625rem;
|
||||
color:#1ab1ff;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-center .sd-body-menus .sd-body-menu .sd-body-menu-value--yellow
|
||||
{
|
||||
color:#ffc277;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-center .sd-body-map .sd-body-map-switch-btn
|
||||
{
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
position:absolute;
|
||||
top:0;
|
||||
right:0;
|
||||
width:.84896rem;
|
||||
height:.23438rem;
|
||||
background:url(../image/index1/map-switch-btn-bg.png) center center/100% 100% no-repeat;
|
||||
font-size:.08333rem;
|
||||
color:#1ab1ff;
|
||||
cursor:pointer;
|
||||
}
|
||||
|
||||
.sd-body .tab-wrap
|
||||
{
|
||||
width:100%;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:space-between;
|
||||
padding-right:.02604rem;
|
||||
}
|
||||
|
||||
.sd-body .tab-wrap .tab
|
||||
{
|
||||
height:.14583rem;
|
||||
font-size:.07292rem;
|
||||
color:#7ECEF7;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
}
|
||||
|
||||
.sd-body .tab-wrap .tab>div
|
||||
{
|
||||
height:.14583rem;
|
||||
line-height:.14583rem;
|
||||
text-align:center;
|
||||
cursor:pointer;
|
||||
padding:0 .05208rem;
|
||||
}
|
||||
|
||||
.sd-body .tab-wrap .tab .active
|
||||
{
|
||||
color:#FFF;
|
||||
position:relative;
|
||||
z-index:0;
|
||||
cursor:default!important;
|
||||
}
|
||||
|
||||
.sd-body .tab-wrap .tab .active::before
|
||||
{
|
||||
height:.14583rem;
|
||||
content:'';
|
||||
position:absolute;
|
||||
top:0;
|
||||
left:0;
|
||||
right:0;
|
||||
bottom:0;
|
||||
z-index:-1;
|
||||
background-color:#19509E;
|
||||
transform:skew(-15deg);
|
||||
}
|
||||
|
||||
.sd-header .sd-header-top,.sd-body .sd-body-top .sd-top-left .stl-top .rightGap
|
||||
{
|
||||
position:relative;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top,.sd-body .sd-body-top .sd-top-left .stl-top .content .item
|
||||
{
|
||||
margin-bottom:.10417rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .tit,.sd-body .sd-body-bottom .bb-item .tit
|
||||
{
|
||||
height:.14583rem;
|
||||
background-color:#0B2A56;
|
||||
font-size:.07292rem;
|
||||
color:#7ecef7;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
padding-left:.05208rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-left,.sd-body .sd-body-top .sd-top-right
|
||||
{
|
||||
width:2.5rem;
|
||||
height:3.56771rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-left .stl-top .stl-top-tw:last-child,.sd-body .sd-body-top .sd-top-center .stc-top .i-item:last-child,.sd-body .sd-body-top .sd-top-center .stc-bottom .i-item:last-child,.sd-body .sd-body-top .sd-top-right .str-top .i-item:last-child,.sd-body .sd-body-bottom .bb-item:last-child
|
||||
{
|
||||
margin-right:0;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-left .stl-top .content .item:last-child,.sd-body .sd-body-top .sd-top-center .stc-bottom .i-item .ii-item:last-child,.sd-body .sd-body-top .sd-top-right .str-bottom .strb-top .strbt-left .sl-item:last-child
|
||||
{
|
||||
margin-bottom:0;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-left .stl-bottom .aqhysj-wrap,.sd-body .sd-body-bottom .bb-item .content .sd-chart
|
||||
{
|
||||
width:100%;
|
||||
height:100%;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-left .stl-bottom .aqhysj-wrap .aqhysj .item .num,.sd-body .sd-body-bottom .bb-item .content .sgsjsj .sg-top .sg-top-item .num,.sd-body .sd-body-bottom .bb-item .content .wdgcsj .item .item-inner .num
|
||||
{
|
||||
color:#1AB1FF;
|
||||
font-size:.08542rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-left .stl-bottom .aqhysj-wrap .aqhysj .item .num1pos,.sd-body .sd-body-top .sd-top-left .stl-bottom .aqhysj-wrap .aqhysj .item .num3pos
|
||||
{
|
||||
position:absolute;
|
||||
top:.13542rem;
|
||||
left:.10417rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-left .stl-bottom .aqhysj-wrap .aqhysj .item .num2pos,.sd-body .sd-body-top .sd-top-left .stl-bottom .aqhysj-wrap .aqhysj .item .num4pos
|
||||
{
|
||||
position:absolute;
|
||||
top:.13542rem;
|
||||
right:.10417rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-center .stc-top .i-item .desc-cl1,.sd-body .sd-body-top .sd-top-center .stc-bottom .i-item .ii-item .num.num-cl2,.sd-body .sd-body-bottom .bb-item .content .wdgcsj .item .item-inner .numC2
|
||||
{
|
||||
color:#12CDA2;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-center .stc-top .i-item .desc-cl3,.sd-body .sd-body-top .sd-top-center .stc-bottom .i-item .ii-item .num.num-cl3
|
||||
{
|
||||
color:#0FF;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-center .stc-top .i-item .desc-cl4,.sd-body .sd-body-top .sd-top-center .stc-bottom .i-item .ii-item .num.num-cl1
|
||||
{
|
||||
color:#F24166;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-center .stc-center .sd-body-map,.sd-body .sd-body-center .sd-body-map
|
||||
{
|
||||
position:relative;
|
||||
margin-top:.20833rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-center .stc-center .sd-body-map .sd-body-map-switch-btn i,.sd-body .sd-body-center .sd-body-map .sd-body-map-switch-btn i
|
||||
{
|
||||
font-size:.08333rem;
|
||||
color:#1ab1ff;
|
||||
margin-left:.04167rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-top .sd-top-right .str-bottom .strb-bottom,.sd-body .sd-body-top .sd-top-right .str-bottom .strb-bottom .strb-bottom-pic
|
||||
{
|
||||
width:100%;
|
||||
height:.98958rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-bottom .bb-item .content .yjglsj .item .item-inner .desc,.sd-body .sd-body-bottom .bb-item .content .wdgcsj .item .item-inner .desc
|
||||
{
|
||||
color:#7ECEF7;
|
||||
font-size:.07292rem;
|
||||
}
|
||||
|
||||
.sd-body .sd-body-left,.sd-body .sd-body-right
|
||||
{
|
||||
width:2.36458rem;
|
||||
}
|
||||
|
||||
@media screen and max-width 1200px {
|
||||
html
|
||||
{
|
||||
font-size:120px;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,623 @@
|
||||
*
|
||||
{
|
||||
box-sizing:border-box;
|
||||
margin:0;
|
||||
padding:0;
|
||||
}
|
||||
|
||||
li,ol
|
||||
{
|
||||
list-style:none;
|
||||
}
|
||||
|
||||
a
|
||||
{
|
||||
text-decoration:none;
|
||||
}
|
||||
|
||||
@font-face
|
||||
{
|
||||
font-family:液晶数字;
|
||||
src:url(../font/液晶数字.woff) format(woff),url(../font/液晶数字.ttf) format(truetype);
|
||||
}
|
||||
|
||||
::-webkit-scrollbar
|
||||
{
|
||||
width:5px;
|
||||
height:5px;
|
||||
background-color:transparent;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track
|
||||
{
|
||||
-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,0.3);
|
||||
border-radius:10px;
|
||||
background-color:#6b81d4;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb
|
||||
{
|
||||
border-radius:10px;
|
||||
-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,0.3);
|
||||
background-color:#1843e2;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover
|
||||
{
|
||||
border-radius:5px;
|
||||
-webkit-box-shadow:inset 0 0 5px rgba(0,0,0,0.2);
|
||||
background:rgba(0,0,0,0.4);
|
||||
}
|
||||
|
||||
html
|
||||
{
|
||||
scrollbar-face-color:#071857;
|
||||
scrollbar-highlight-color:#010a2c;
|
||||
scrollbar-3dlight-color:#010a2c;
|
||||
scrollbar-darkshadow-color:#010a2c;
|
||||
scrollbar-shadow-color:#071857;
|
||||
scrollbar-arrow-color:rgba(1,10,44,0.4);
|
||||
scrollbar-track-color:#071857;
|
||||
font-size:10vw;
|
||||
width:100%;
|
||||
height:100%;
|
||||
min-width:1200px;
|
||||
font-family:Microsoft YaHei;
|
||||
line-height:1;
|
||||
background: rgb(1,8,24);
|
||||
}
|
||||
|
||||
.ellipsis
|
||||
{
|
||||
overflow:hidden;
|
||||
text-overflow:ellipsis;
|
||||
white-space:nowrap;
|
||||
}
|
||||
|
||||
.flexCenter
|
||||
{
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
}
|
||||
|
||||
.flexCenterV
|
||||
{
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
flex-direction:column;
|
||||
}
|
||||
|
||||
.sd-index2-body
|
||||
{
|
||||
background:#010817;
|
||||
background-image:url(../image/index2/bj.png);
|
||||
background-position:center center;
|
||||
background-size:100% 100%;
|
||||
background-repeat:no-repeat;
|
||||
}
|
||||
|
||||
.sd-header
|
||||
{
|
||||
position:relative;
|
||||
width:100%;
|
||||
height:.30729rem;
|
||||
background:url(../image/index2/header-bg.png) center center/100% 100% no-repeat;
|
||||
padding:0 .10417rem;
|
||||
}
|
||||
|
||||
.sd-header .sd-header-title
|
||||
{
|
||||
position:absolute;
|
||||
top:.03646rem;
|
||||
left:50%;
|
||||
transform:translate(-50%);
|
||||
font-size:.16667rem;
|
||||
color:#0FF;
|
||||
white-space:nowrap;
|
||||
}
|
||||
|
||||
.sd-header .sd-header-top
|
||||
{
|
||||
position:relative;
|
||||
}
|
||||
|
||||
.sd-header .sd-header-top .sd-header-top-left
|
||||
{
|
||||
position:absolute;
|
||||
left:.10417rem;
|
||||
top:.05208rem;
|
||||
color:#1ab1ff;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
}
|
||||
|
||||
.sd-header .sd-header-top .sd-header-top-left .sd-location-name
|
||||
{
|
||||
margin-right:.09375rem;
|
||||
}
|
||||
|
||||
.sd-header .sd-header-top .sd-header-top-right
|
||||
{
|
||||
position:absolute;
|
||||
top:.03646rem;
|
||||
right:0;
|
||||
}
|
||||
|
||||
.sd-header .sd-header-top .sd-header-top-right .sd-location-time
|
||||
{
|
||||
font-size:.0625rem;
|
||||
color:#B0E1FF;
|
||||
}
|
||||
|
||||
.sd-body
|
||||
{
|
||||
margin-top:.10938rem;
|
||||
display:flex;
|
||||
padding:0 .10417rem .09375rem;
|
||||
padding:.10833rem;
|
||||
}
|
||||
|
||||
.sd-body .tit
|
||||
{
|
||||
height:.14583rem;
|
||||
background-color:#0B2A56;
|
||||
font-size:.07292rem;
|
||||
color:#7ecef7;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
padding-left:.05208rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-left .sbl-top,.sd-body .sb-left .sbl-center,.sd-body .sb-left .sbl-bottom
|
||||
{
|
||||
background:rgba(1,20,56,0.5);
|
||||
border:1px solid #173762;
|
||||
height:1.63542rem;
|
||||
margin-bottom:.10417rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-left .sbl-top .zlpxsj-wrap
|
||||
{
|
||||
display:flex;
|
||||
justify-content:center;
|
||||
align-items:flex-end;
|
||||
height:1.48958rem;
|
||||
padding-bottom:.02083rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-left .sbl-top .zlpxsj-wrap .zlpxsj
|
||||
{
|
||||
width:2.15625rem;
|
||||
height:1.19792rem;
|
||||
background:url(../image/index2/zlpxsj.png) center center/100% 100% no-repeat;
|
||||
position:relative;
|
||||
}
|
||||
|
||||
.sd-body .sb-left .sbl-top .zlpxsj-wrap .zlpxsj .left
|
||||
{
|
||||
position:absolute;
|
||||
left:0;
|
||||
bottom:.47917rem;
|
||||
text-align:right;
|
||||
}
|
||||
|
||||
.sd-body .sb-left .sbl-top .zlpxsj-wrap .zlpxsj .right
|
||||
{
|
||||
position:absolute;
|
||||
right:0;
|
||||
top:.11979rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-left .sbl-top .zlpxsj-wrap .zlpxsj .num
|
||||
{
|
||||
color:#0FF;
|
||||
font-size:.15625rem;
|
||||
margin-bottom:.0625rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-left .sbl-top .zlpxsj-wrap .zlpxsj .desc
|
||||
{
|
||||
color:#FFF;
|
||||
font-size:.07292rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-left .sbl-center .sblc-content
|
||||
{
|
||||
height:1.48958rem;
|
||||
padding:0 .15625rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-left .sbl-center .sblc-content .rightGap
|
||||
{
|
||||
width:.00521rem;
|
||||
height:1.32813rem;
|
||||
position:relative;
|
||||
margin:0 .16146rem 0 .16667rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-left .sbl-center .sblc-content .rightGap::before
|
||||
{
|
||||
content:'';
|
||||
background:url(../image/index2/spline.png) center center/100% 100%;
|
||||
position:absolute;
|
||||
top:0;
|
||||
right:0;
|
||||
width:.00521rem;
|
||||
height:1.32813rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-left .sbl-center .sblc-content .item
|
||||
{
|
||||
width:.92188rem;
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
align-items:flex-end;
|
||||
position:relative;
|
||||
padding-bottom:.0625rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-left .sbl-center .sblc-content .item::before
|
||||
{
|
||||
content:'';
|
||||
background:url(../image/index2/spline1.png) center center/100% 100%;
|
||||
position:absolute;
|
||||
bottom:0;
|
||||
right:0;
|
||||
width:.91667rem;
|
||||
height:.03125rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-left .sbl-center .sblc-content .item .desc
|
||||
{
|
||||
color:#fff;
|
||||
font-size:.09375rem;
|
||||
margin-bottom:.17708rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-left .sbl-center .sblc-content .item .num-wrap
|
||||
{
|
||||
display:flex;
|
||||
align-items:flex-end;
|
||||
}
|
||||
|
||||
.sd-body .sb-left .sbl-center .sblc-content .item .num-wrap .num
|
||||
{
|
||||
color:#00D5E9;
|
||||
font-size:.23958rem;
|
||||
margin-right:.07813rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-left .sbl-center .sblc-content .item .num-wrap .num.num-cl
|
||||
{
|
||||
color:#15EDBB;
|
||||
}
|
||||
|
||||
.sd-body .sb-left .sbl-center .sblc-content .item .num-wrap .unit
|
||||
{
|
||||
color:#00D5E9;
|
||||
font-size:.08333rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-left .sbl-bottom
|
||||
{
|
||||
margin-bottom:0;
|
||||
}
|
||||
|
||||
.sd-body .sb-left .sbl-bottom .zlglry-wrap
|
||||
{
|
||||
height:1.48958rem;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
}
|
||||
|
||||
.sd-body .sb-left .sbl-bottom .zlglry-wrap .zlglry
|
||||
{
|
||||
width:1.65625rem;
|
||||
height:1.34375rem;
|
||||
background:url(../image/index2/zlglry.png) center center/100% 100% no-repeat;
|
||||
position:relative;
|
||||
}
|
||||
|
||||
.sd-body .sb-left .sbl-bottom .zlglry-wrap .zlglry .item
|
||||
{
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
}
|
||||
|
||||
.sd-body .sb-left .sbl-bottom .zlglry-wrap .zlglry .item .num
|
||||
{
|
||||
font-size:.125rem;
|
||||
color:#1AB1FF;
|
||||
margin-bottom:.03646rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-left .sbl-bottom .zlglry-wrap .zlglry .item .desc
|
||||
{
|
||||
font-size:.0625rem;
|
||||
color:#fff;
|
||||
}
|
||||
|
||||
.sd-body .sb-left .sbl-bottom .zlglry-wrap .zlglry .top
|
||||
{
|
||||
position:absolute;
|
||||
top:.16667rem;
|
||||
left:50%;
|
||||
transform:translateX(-50%);
|
||||
}
|
||||
|
||||
.sd-body .sb-left .sbl-bottom .zlglry-wrap .zlglry .left
|
||||
{
|
||||
position:absolute;
|
||||
left:.125rem;
|
||||
bottom:.16667rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-left .sbl-bottom .zlglry-wrap .zlglry .right
|
||||
{
|
||||
position:absolute;
|
||||
right:.13542rem;
|
||||
bottom:.16667rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-center
|
||||
{
|
||||
width:4.58333rem;
|
||||
margin:0 .10417rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-center .sbc-top .sbct-left,.sd-body .sb-center .sbc-top .sbct-right
|
||||
{
|
||||
width:2.23958rem;
|
||||
height:1.91146rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-center .sbc-top .sbct-left
|
||||
{
|
||||
margin-right:.10417rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-center .sbc-center
|
||||
{
|
||||
width:4.58333rem;
|
||||
height:1.76042rem;
|
||||
margin:.10417rem 0;
|
||||
}
|
||||
|
||||
.sd-body .sb-center .sbc-center .pic
|
||||
{
|
||||
width:4.58333rem;
|
||||
height:1.65625rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-center .sbc-bottom
|
||||
{
|
||||
height:1.23438rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-center .sbc-bottom .sbcb-content
|
||||
{
|
||||
display:flex;
|
||||
padding:.14583rem .20833rem .13021rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-center .sbc-bottom .sbcb-content .item
|
||||
{
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
margin-right:.39583rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-center .sbc-bottom .sbcb-content .item:last-child
|
||||
{
|
||||
margin-right:0;
|
||||
}
|
||||
|
||||
.sd-body .sb-center .sbc-bottom .sbcb-content .item .num
|
||||
{
|
||||
font-size:.20833rem;
|
||||
margin-bottom:-.07813rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-center .sbc-bottom .sbcb-content .item .desc
|
||||
{
|
||||
font-size:.07292rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-center .sbc-bottom .sbcb-content .item .pic
|
||||
{
|
||||
width:.51563rem;
|
||||
height:.5rem;
|
||||
margin-bottom:.09375rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-center .sbc-bottom .sbcb-content .item.item1 .num,.sd-body .sb-center .sbc-bottom .sbcb-content .item.item1 .desc
|
||||
{
|
||||
color:#0FF;
|
||||
}
|
||||
|
||||
.sd-body .sb-center .sbc-bottom .sbcb-content .item.item1 .pic
|
||||
{
|
||||
background:url(../image/index2/gchf1.png) center center/100% 100% no-repeat;
|
||||
}
|
||||
|
||||
.sd-body .sb-center .sbc-bottom .sbcb-content .item.item2 .num,.sd-body .sb-center .sbc-bottom .sbcb-content .item.item2 .desc
|
||||
{
|
||||
color:#1AB1FF;
|
||||
}
|
||||
|
||||
.sd-body .sb-center .sbc-bottom .sbcb-content .item.item2 .pic
|
||||
{
|
||||
background:url(../image/index2/gchf2.png) center center/100% 100% no-repeat;
|
||||
}
|
||||
|
||||
.sd-body .sb-center .sbc-bottom .sbcb-content .item.item3 .pic
|
||||
{
|
||||
background:url(../image/index2/gchf3.png) center center/100% 100% no-repeat;
|
||||
}
|
||||
|
||||
.sd-body .sb-center .sbc-bottom .sbcb-content .item.item4 .num,.sd-body .sb-center .sbc-bottom .sbcb-content .item.item4 .desc
|
||||
{
|
||||
color:#FFA12F;
|
||||
}
|
||||
|
||||
.sd-body .sb-center .sbc-bottom .sbcb-content .item.item4 .pic
|
||||
{
|
||||
background:url(../image/index2/gchf4.png) center center/100% 100% no-repeat;
|
||||
}
|
||||
|
||||
.sd-body .sb-center .sbc-bottom .sbcb-content .item.item5 .num,.sd-body .sb-center .sbc-bottom .sbcb-content .item.item5 .desc
|
||||
{
|
||||
color:#E0CA11;
|
||||
}
|
||||
|
||||
.sd-body .sb-center .sbc-bottom .sbcb-content .item.item5 .pic
|
||||
{
|
||||
background:url(../image/index2/gchf5.png) center center/100% 100% no-repeat;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-content
|
||||
{
|
||||
height:5.11458rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-content .sbrc-item
|
||||
{
|
||||
height:4.90625rem;
|
||||
padding-top:.15625rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-content .sbrc-item .sbrci-bigTit
|
||||
{
|
||||
color:#17F7FF;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
position:relative;
|
||||
width:2.08333rem;
|
||||
height:.65625rem;
|
||||
background:url(../image/index2/bigtit.png) center center/100% 100% no-repeat;
|
||||
margin:0 .15625rem 0 .26042rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-content .sbrc-item .sbrci-bigTit .sbig-left
|
||||
{
|
||||
font-size:.10417rem;
|
||||
position:absolute;
|
||||
left:.30208rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-content .sbrc-item .sbrci-bigTit .sbig-left .first
|
||||
{
|
||||
margin-bottom:.01563rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-content .sbrc-item .sbrci-bigTit .sbig-right
|
||||
{
|
||||
font-size:.20833rem;
|
||||
width:1.40625rem;
|
||||
margin-left:.67708rem;
|
||||
text-align:center;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-content .sbrc-item .sbrci-list
|
||||
{
|
||||
display:flex;
|
||||
flex-wrap:wrap;
|
||||
font-size:0;
|
||||
margin-top:.20833rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-content .sbrc-item .sbrci-list .item
|
||||
{
|
||||
width:50%;
|
||||
display:flex;
|
||||
justify-content:center;
|
||||
margin-bottom:.1875rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-content .sbrc-item .sbrci-list .item .item-c
|
||||
{
|
||||
width:.50521rem;
|
||||
height:.60417rem;
|
||||
background:url(../image/index2/hgzs.png) center center/100% 100% no-repeat;
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
align-items:center;
|
||||
justify-content:space-between;
|
||||
padding:.18229rem 0 .07813rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-content .sbrc-item .sbrci-list .item .num
|
||||
{
|
||||
font-size:.14583rem;
|
||||
font-weight:700;
|
||||
color:#7ECEF7;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-content .sbrc-item .sbrci-list .item .desc
|
||||
{
|
||||
font-size:.07292rem;
|
||||
color:#CDE7FF;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-content .sbrc-item .sbrci-smallTit
|
||||
{
|
||||
width:2.5rem;
|
||||
height:.19792rem;
|
||||
background:url(../image/index2/smalltit.png) center center/100% 100% no-repeat;
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
color:#7ECEF7;
|
||||
font-size:.08333rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-content .sbrc-item .pic
|
||||
{
|
||||
width:2.5rem;
|
||||
margin-top:.15625rem;
|
||||
height:2.00521rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-left,.sd-body .sb-right
|
||||
{
|
||||
width:2.5rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-center .bg,.sd-body .sb-right .bg
|
||||
{
|
||||
background:rgba(1,20,56,0.5);
|
||||
border:1px solid #173762;
|
||||
}
|
||||
|
||||
.sd-body .sb-center .sbc-top .sbct-left .pic,.sd-body .sb-center .sbc-top .sbct-right .pic
|
||||
{
|
||||
width:2.23958rem;
|
||||
height:1.76563rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-center .sbc-center .tit,.sd-body .sb-center .sbc-bottom .tit
|
||||
{
|
||||
width:100%;
|
||||
justify-content:center;
|
||||
padding-left:0;
|
||||
}
|
||||
|
||||
.sd-body .sb-center .sbc-bottom .sbcb-content .item.item3 .num,.sd-body .sb-center .sbc-bottom .sbcb-content .item.item3 .desc,.sd-body .sb-right .sbr-content .sbrc-item .sbrci-list .item .num.num1
|
||||
{
|
||||
color:#12CDA2;
|
||||
}
|
||||
|
||||
@media screen and max-width 1200px {
|
||||
html
|
||||
{
|
||||
font-size:120px;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,474 @@
|
||||
*
|
||||
{
|
||||
box-sizing:border-box;
|
||||
margin:0;
|
||||
padding:0;
|
||||
}
|
||||
|
||||
li,ol
|
||||
{
|
||||
list-style:none;
|
||||
}
|
||||
|
||||
a
|
||||
{
|
||||
text-decoration:none;
|
||||
}
|
||||
|
||||
@font-face
|
||||
{
|
||||
font-family:液晶数字;
|
||||
src:url(../font/液晶数字.woff) format(woff),url(../font/液晶数字.ttf) format(truetype);
|
||||
}
|
||||
|
||||
::-webkit-scrollbar
|
||||
{
|
||||
width:5px;
|
||||
height:5px;
|
||||
background-color:transparent;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track
|
||||
{
|
||||
-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,0.3);
|
||||
border-radius:10px;
|
||||
background-color:#6b81d4;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb
|
||||
{
|
||||
border-radius:10px;
|
||||
-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,0.3);
|
||||
background-color:#1843e2;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover
|
||||
{
|
||||
border-radius:5px;
|
||||
-webkit-box-shadow:inset 0 0 5px rgba(0,0,0,0.2);
|
||||
background:rgba(0,0,0,0.4);
|
||||
}
|
||||
|
||||
html
|
||||
{
|
||||
scrollbar-face-color:#071857;
|
||||
scrollbar-highlight-color:#010a2c;
|
||||
scrollbar-3dlight-color:#010a2c;
|
||||
scrollbar-darkshadow-color:#010a2c;
|
||||
scrollbar-shadow-color:#071857;
|
||||
scrollbar-arrow-color:rgba(1,10,44,0.4);
|
||||
scrollbar-track-color:#071857;
|
||||
font-size:10vw;
|
||||
width:100%;
|
||||
height:100%;
|
||||
min-width:1200px;
|
||||
font-family:Microsoft YaHei;
|
||||
line-height:1;
|
||||
}
|
||||
|
||||
.ellipsis
|
||||
{
|
||||
overflow:hidden;
|
||||
text-overflow:ellipsis;
|
||||
white-space:nowrap;
|
||||
}
|
||||
|
||||
.flexCenter
|
||||
{
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
}
|
||||
|
||||
.flexCenterV
|
||||
{
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
flex-direction:column;
|
||||
}
|
||||
|
||||
.sd-index3-body
|
||||
{
|
||||
background:#010817;
|
||||
background-image:url(../image/index3/bj.png);
|
||||
background-position:center center;
|
||||
background-size:100% 100%;
|
||||
background-repeat:no-repeat;
|
||||
}
|
||||
|
||||
.sd-header
|
||||
{
|
||||
position:relative;
|
||||
width:100%;
|
||||
height:.4375rem;
|
||||
background:url(../image/index3/header-bg.png) center center/100% 100% no-repeat;
|
||||
padding:0 .10417rem;
|
||||
}
|
||||
|
||||
.sd-header .sd-header-title
|
||||
{
|
||||
position:absolute;
|
||||
top:.11458rem;
|
||||
left:50%;
|
||||
transform:translate(-50%);
|
||||
font-size:.20833rem;
|
||||
color:#1AB1FF;
|
||||
white-space:nowrap;
|
||||
text-shadow:0 5px 0 rgba(5,63,152,0.5);
|
||||
font-weight:700;
|
||||
}
|
||||
|
||||
.sd-header .sd-header-top
|
||||
{
|
||||
position:relative;
|
||||
}
|
||||
|
||||
.sd-header .sd-header-top .sd-header-top-left
|
||||
{
|
||||
position:absolute;
|
||||
left:.10417rem;
|
||||
top:.05208rem;
|
||||
color:#1ab1ff;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
}
|
||||
|
||||
.sd-header .sd-header-top .sd-header-top-left .sd-location-name
|
||||
{
|
||||
margin-right:.09375rem;
|
||||
}
|
||||
|
||||
.sd-header .sd-header-top .sd-header-top-right
|
||||
{
|
||||
position:absolute;
|
||||
top:.03646rem;
|
||||
right:0;
|
||||
}
|
||||
|
||||
.sd-header .sd-header-top .sd-header-top-right .sd-location-time
|
||||
{
|
||||
font-size:.0625rem;
|
||||
color:#B0E1FF;
|
||||
}
|
||||
|
||||
.sd-body
|
||||
{
|
||||
height:5.1875rem;
|
||||
display:flex;
|
||||
padding:.20833rem;
|
||||
}
|
||||
|
||||
.sd-body .tit
|
||||
{
|
||||
width:1.08333rem;
|
||||
height:.23438rem;
|
||||
font-size:.08333rem;
|
||||
color:#FFF;
|
||||
background:url(../image/index3/tit.png) center center/100% 100% no-repeat;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
margin:0 auto;
|
||||
}
|
||||
|
||||
.sd-body .bg
|
||||
{
|
||||
background:rgba(3,39,109,0.1);
|
||||
border:1px solid #03276D;
|
||||
box-shadow:inset 0 0 .18229rem .01563rem rgba(3,39,109,0.6);
|
||||
}
|
||||
|
||||
.sd-body .sb-left
|
||||
{
|
||||
width:2.60417rem;
|
||||
margin-right:.20833rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-left .sbl-top,.sd-body .sb-left .sbl-bottom
|
||||
{
|
||||
background:rgba(3,39,109,0.1);
|
||||
border:1px solid #03276D;
|
||||
height:2.28125rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-left .sbl-top .pic
|
||||
{
|
||||
width:100%;
|
||||
height:2.01563rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-left .sbl-bottom
|
||||
{
|
||||
margin-bottom:0;
|
||||
}
|
||||
|
||||
.sd-body .sb-left .sbl-bottom .sblb-list
|
||||
{
|
||||
width:2.60417rem;
|
||||
display:flex;
|
||||
flex-wrap:wrap;
|
||||
padding:.15625rem .15625rem .05208rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-left .sbl-bottom .sblb-list .sblbl-item
|
||||
{
|
||||
margin-right:.15625rem;
|
||||
margin-bottom:.10417rem;
|
||||
width:1.0625rem;
|
||||
height:.51042rem;
|
||||
background:url(../image/index3/zdwjy.png) center center/100% 100% no-repeat;
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
justify-content:space-between;
|
||||
padding:.07813rem .10417rem .07813rem .07292rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-left .sbl-bottom .sblb-list .sblbl-item .desc
|
||||
{
|
||||
font-size:.07292rem;
|
||||
color:#7ECEF7;
|
||||
}
|
||||
|
||||
.sd-body .sb-left .sbl-bottom .sblb-list .sblbl-item .num
|
||||
{
|
||||
font-size:.20833rem;
|
||||
color:#7ECEF7;
|
||||
text-align:right;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-top .sbrt-left
|
||||
{
|
||||
margin-right:.20833rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-top .sbrt-left .sbrtl-top,.sd-body .sb-right .sbr-top .sbrt-left .sbrtl-bottom
|
||||
{
|
||||
width:3.95833rem;
|
||||
height:1.45313rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-top .sbrt-left .sbrtl-top .sbrtlt-list
|
||||
{
|
||||
display:flex;
|
||||
padding:.28646rem .18229rem .26042rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-top .sbrt-left .sbrtl-top .sbrtlt-list .sbrtlt-item
|
||||
{
|
||||
width:.92708rem;
|
||||
height:.72917rem;
|
||||
font-size:.08333rem;
|
||||
color:#FFF;
|
||||
margin-right:.375rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-top .sbrt-left .sbrtl-top .sbrtlt-list .sbrtlt-item .desc
|
||||
{
|
||||
font-size:.08333rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-top .sbrt-left .sbrtl-top .sbrtlt-list .sbrtlt-item .num
|
||||
{
|
||||
font-size:.20833rem;
|
||||
margin-bottom:.10417rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-top .sbrt-left .sbrtl-top .sbrtlt-list .item-bg1
|
||||
{
|
||||
background:url(../image/index3/jcsjbg1.png) center center/100% 100% no-repeat;
|
||||
color:#0FF;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-top .sbrt-left .sbrtl-top .sbrtlt-list .item-bg2
|
||||
{
|
||||
background:url(../image/index3/jcsjbg2.png) center center/100% 100% no-repeat;
|
||||
color:#12CDA2;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-top .sbrt-left .sbrtl-top .sbrtlt-list .item-bg3
|
||||
{
|
||||
background:url(../image/index3/jcsjbg3.png) center center/100% 100% no-repeat;
|
||||
color:#FFA12F;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-top .sbrt-left .sbrtl-bottom .sbrtlb-list
|
||||
{
|
||||
display:flex;
|
||||
padding:.15625rem .26042rem .18229rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-top .sbrt-left .sbrtl-bottom .sbrtlb-list .sbrtlb-item
|
||||
{
|
||||
margin-right:.39583rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-top .sbrt-left .sbrtl-bottom .sbrtlb-list .sbrtlb-item:first-child
|
||||
{
|
||||
width:.84896rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-top .sbrt-left .sbrtl-bottom .sbrtlb-list .sbrtlb-item:nth-child(2)
|
||||
{
|
||||
width:.97396rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-top .sbrt-left .sbrtl-bottom .sbrtlb-list .sbrtlb-item:last-child
|
||||
{
|
||||
width:.84896rem;
|
||||
margin-right:0;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-top .sbrt-left .sbrtl-bottom .sbrtlb-list .item-bg1
|
||||
{
|
||||
width:.84896rem;
|
||||
height:.76042rem;
|
||||
background:url(../image/index3/hbsjbg1.png) center center/100% 100% no-repeat;
|
||||
color:#7ECEF7;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-top .sbrt-left .sbrtl-bottom .sbrtlb-list .item-bg2
|
||||
{
|
||||
width:.97396rem;
|
||||
height:.6875rem;
|
||||
background:url(../image/index3/hbsjbg2.png) center center/100% 100% no-repeat;
|
||||
color:#0FF;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-top .sbrt-left .sbrtl-bottom .sbrtlb-list .item-bg3
|
||||
{
|
||||
width:.84896rem;
|
||||
height:.76042rem;
|
||||
background:url(../image/index3/hbsjbg3.png) center center/100% 100% no-repeat;
|
||||
color:#7ECEF7;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-top .sbrt-left .sbrtl-bottom .sbrtlb-list .num
|
||||
{
|
||||
font-size:.15625rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-top .sbrt-left .sbrtl-bottom .sbrtlb-list .desc
|
||||
{
|
||||
color:#FFF;
|
||||
font-size:.07292rem;
|
||||
text-align:center;
|
||||
margin-top:.04688rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-top .sbrt-left .sbrtl-bottom .sbrtlb-list .desc.mt
|
||||
{
|
||||
margin-top:.125rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-top .sbrt-right
|
||||
{
|
||||
width:2.60417rem;
|
||||
height:3.11458rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-top .sbrt-right .sbrtr-content
|
||||
{
|
||||
padding-top:.10417rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-top .sbrt-right .sbrtr-content .item
|
||||
{
|
||||
margin-bottom:.3125rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-top .sbrt-right .sbrtr-content .item .i-tit.tbg
|
||||
{
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
width:.625rem;
|
||||
height:.15625rem;
|
||||
font-size:.07292rem;
|
||||
background:url(../image/index3/yhpczltit.png) center center/100% 100% no-repeat;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-top .sbrt-right .sbrtr-content .item .i-tit.tbg1
|
||||
{
|
||||
color:#7ECEF7;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-top .sbrt-right .sbrtr-content .item .i-tit.tbg2
|
||||
{
|
||||
color:#F24166;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-top .sbrt-right .sbrtr-content .item .i-list
|
||||
{
|
||||
margin-top:.16667rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-top .sbrt-right .sbrtr-content .item .bg1
|
||||
{
|
||||
width:.56771rem;
|
||||
height:.75rem;
|
||||
background:url(../image/index3/yhpczlc1.png) center center/100% 100% no-repeat;
|
||||
color:#0FF;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-top .sbrt-right .sbrtr-content .item .bg2
|
||||
{
|
||||
width:.56771rem;
|
||||
height:.75rem;
|
||||
background:url(../image/index3/yhpczlc2.png) center center/100% 100% no-repeat;
|
||||
color:#FFA12F;
|
||||
margin:0 .23958rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-top .sbrt-right .sbrtr-content .item .bg3
|
||||
{
|
||||
width:.56771rem;
|
||||
height:.75rem;
|
||||
background:url(../image/index3/yhpczlc3.png) center center/100% 100% no-repeat;
|
||||
color:#1AB1FF;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-top .sbrt-right .sbrtr-content .item .bg3 .num
|
||||
{
|
||||
font-size:.16667rem!important;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-top .sbrt-right .sbrtr-content .item .num
|
||||
{
|
||||
font-size:.21875rem;
|
||||
margin-bottom:.15104rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-top .sbrt-right .sbrtr-content .item .desc
|
||||
{
|
||||
font-size:.07292rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-bottom
|
||||
{
|
||||
width:6.77083rem;
|
||||
height:1.45313rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-right .sbr-bottom .zygl
|
||||
{
|
||||
width:100%;
|
||||
height:1.21875rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-left .sbl-top,.sd-body .sb-right .sbr-top,.sd-body .sb-right .sbr-top .sbrt-left .sbrtl-top
|
||||
{
|
||||
margin-bottom:.20833rem;
|
||||
}
|
||||
|
||||
.sd-body .sb-left .sbl-bottom .sblb-list .sblbl-item:nth-child(2n),.sd-body .sb-right .sbr-top .sbrt-left .sbrtl-top .sbrtlt-list .sbrtlt-item:last-child
|
||||
{
|
||||
margin-right:0;
|
||||
}
|
||||
|
||||
@media screen and max-width 1200px {
|
||||
html
|
||||
{
|
||||
font-size:120px;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,35 @@
|
||||
@font-face {
|
||||
font-family: "iconfont"; /* Project id 2823647 */
|
||||
src: url('iconfont.woff2?t=1632043193027') format('woff2'),
|
||||
url('iconfont.woff?t=1632043193027') format('woff'),
|
||||
url('iconfont.ttf?t=1632043193027') format('truetype');
|
||||
}
|
||||
|
||||
.iconfont {
|
||||
font-family: "iconfont" !important;
|
||||
font-size: 16px;
|
||||
font-style: normal;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
.icon-switch:before {
|
||||
content: "\e65b";
|
||||
}
|
||||
|
||||
.icon-user:before {
|
||||
content: "\e603";
|
||||
}
|
||||
|
||||
.icon-stop:before {
|
||||
content: "\e60d";
|
||||
}
|
||||
|
||||
.icon-message:before {
|
||||
content: "\e632";
|
||||
}
|
||||
|
||||
.icon-setting:before {
|
||||
content: "\e696";
|
||||
}
|
||||
|
||||
|
After Width: | Height: | Size: 125 KiB |
|
After Width: | Height: | Size: 264 KiB |
|
After Width: | Height: | Size: 21 KiB |
|
After Width: | Height: | Size: 350 B |
|
After Width: | Height: | Size: 343 B |
|
After Width: | Height: | Size: 878 KiB |
|
After Width: | Height: | Size: 4.8 KiB |
|
After Width: | Height: | Size: 4.1 KiB |
|
After Width: | Height: | Size: 11 KiB |
|
After Width: | Height: | Size: 5.3 KiB |
|
After Width: | Height: | Size: 1.5 KiB |
|
After Width: | Height: | Size: 1.6 KiB |
|
After Width: | Height: | Size: 2.3 KiB |
|
After Width: | Height: | Size: 1.6 KiB |
|
After Width: | Height: | Size: 4.1 KiB |
|
After Width: | Height: | Size: 308 B |
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 4.2 KiB |
|
After Width: | Height: | Size: 2.3 KiB |
|
After Width: | Height: | Size: 246 B |
|
After Width: | Height: | Size: 4.4 KiB |
|
After Width: | Height: | Size: 12 KiB |
|
After Width: | Height: | Size: 667 B |
|
After Width: | Height: | Size: 5.1 KiB |
|
After Width: | Height: | Size: 4.2 KiB |
|
After Width: | Height: | Size: 5.3 KiB |
|
After Width: | Height: | Size: 25 KiB |
|
After Width: | Height: | Size: 878 KiB |
|
After Width: | Height: | Size: 7.5 KiB |
|
After Width: | Height: | Size: 12 KiB |
|
After Width: | Height: | Size: 14 KiB |
|
After Width: | Height: | Size: 14 KiB |
|
After Width: | Height: | Size: 14 KiB |
|
After Width: | Height: | Size: 5.3 KiB |
|
After Width: | Height: | Size: 4.4 KiB |
|
After Width: | Height: | Size: 7.2 KiB |
|
After Width: | Height: | Size: 560 B |
|
After Width: | Height: | Size: 235 B |
|
After Width: | Height: | Size: 81 KiB |
|
After Width: | Height: | Size: 39 KiB |
|
After Width: | Height: | Size: 48 KiB |
|
After Width: | Height: | Size: 47 KiB |
|
After Width: | Height: | Size: 66 KiB |
|
After Width: | Height: | Size: 58 KiB |
|
After Width: | Height: | Size: 2.7 KiB |
|
After Width: | Height: | Size: 42 KiB |
|
After Width: | Height: | Size: 7.7 KiB |
|
After Width: | Height: | Size: 12 KiB |
|
After Width: | Height: | Size: 8.0 KiB |
|
After Width: | Height: | Size: 78 KiB |
|
After Width: | Height: | Size: 11 KiB |
|
After Width: | Height: | Size: 11 KiB |
|
After Width: | Height: | Size: 11 KiB |
|
After Width: | Height: | Size: 6.5 KiB |
|
After Width: | Height: | Size: 1.6 KiB |
|
After Width: | Height: | Size: 1.6 KiB |
|
After Width: | Height: | Size: 1.6 KiB |
|
After Width: | Height: | Size: 2.7 KiB |
|
After Width: | Height: | Size: 11 KiB |
|
After Width: | Height: | Size: 47 KiB |
|
After Width: | Height: | Size: 35 KiB |
|
After Width: | Height: | Size: 35 KiB |
@@ -0,0 +1,624 @@
|
||||
/*
|
||||
Background Stretcher jQuery Plugin
|
||||
© 2011 ajaxBlender.com
|
||||
For any questions please visit www.ajaxblender.com
|
||||
or email us at support@ajaxblender.com
|
||||
|
||||
Version: 2.0.1
|
||||
*/
|
||||
|
||||
;(function($){
|
||||
/* Variables */
|
||||
var container = null;
|
||||
var allLIs = '', containerStr = '';
|
||||
|
||||
var element = this;
|
||||
var _bgStretcherPause = false;
|
||||
var _bgStretcherAction = false;
|
||||
var _bgStretcherTm = null;
|
||||
var random_line = new Array();
|
||||
var random_temp = new Array();
|
||||
var r_image = 0;
|
||||
var swf_mode = false;
|
||||
var img_options = new Array();
|
||||
|
||||
$.fn.bgStretcher = function(settings){
|
||||
|
||||
if ($('.bgstretcher-page').length || $('.bgstretcher-area').length) {
|
||||
if(typeof(console) !== 'undefined' && console != null) console.log('More than one bgStretcher');
|
||||
return false;
|
||||
}
|
||||
settings = $.extend({}, $.fn.bgStretcher.defaults, settings);
|
||||
$.fn.bgStretcher.settings = settings;
|
||||
|
||||
function _build(body_content){
|
||||
if(!settings.images.length){ return; }
|
||||
|
||||
_genHtml(body_content);
|
||||
|
||||
containerStr = '#' + settings.imageContainer;
|
||||
container = $(containerStr);
|
||||
allLIs = '#' + settings.imageContainer + ' LI';
|
||||
$(allLIs).hide().css({'z-index': 1, overflow: 'hidden'});
|
||||
|
||||
if(!container.length){ return; }
|
||||
$(window).resize(function(){
|
||||
_resize(body_content)
|
||||
});
|
||||
|
||||
_resize(body_content);
|
||||
|
||||
var stratElement = 0;
|
||||
/* Rebuild images for simpleSlide */
|
||||
if (settings.transitionEffect == 'simpleSlide') {
|
||||
if (settings.sequenceMode == 'random') {
|
||||
if(typeof(console) !== 'undefined' && console != null) {
|
||||
console.log('Effect \'simpleSlide\' don\'t be to use with mode random.');
|
||||
console.log('Mode was automaticly set in normal.');
|
||||
}
|
||||
}
|
||||
$(allLIs).css({'float': 'left', position: 'static'});
|
||||
$(allLIs).show();
|
||||
if ($.fn.bgStretcher.settings.slideDirection == 'NW' || $.fn.bgStretcher.settings.slideDirection == 'NE') {
|
||||
$.fn.bgStretcher.settings.slideDirection = 'N';
|
||||
}
|
||||
if ($.fn.bgStretcher.settings.slideDirection == 'SW' || $.fn.bgStretcher.settings.slideDirection == 'SE') {
|
||||
$.fn.bgStretcher.settings.slideDirection = 'S';
|
||||
}
|
||||
if ($.fn.bgStretcher.settings.slideDirection == 'S' || $.fn.bgStretcher.settings.slideDirection == 'E') {
|
||||
settings.sequenceMode = 'back';
|
||||
$(allLIs).removeClass('bgs-current');
|
||||
$(allLIs).eq($(allLIs).length - $.fn.bgStretcher.settings.startElementIndex - 1).addClass('bgs-current');
|
||||
if ($.fn.bgStretcher.settings.slideDirection == 'E') {
|
||||
l = $(containerStr + ' LI').index($(containerStr + ' LI.bgs-current')) * $(containerStr).width()*(-1);
|
||||
t = 0;
|
||||
} else { // S
|
||||
t = $(containerStr + ' LI').index($(containerStr + ' LI.bgs-current')) * $(containerStr).height()*(-1);
|
||||
l = 0;
|
||||
}
|
||||
$(containerStr+' UL').css({left: l+'px', top: t+'px'});
|
||||
} else {
|
||||
settings.sequenceMode = 'normal';
|
||||
if ($.fn.bgStretcher.settings.startElementIndex != 0) {
|
||||
if ($.fn.bgStretcher.settings.slideDirection == 'N') {
|
||||
t = $(containerStr + ' LI').index($(containerStr + ' LI.bgs-current')) * $(containerStr).height()*(-1);
|
||||
l = 0;
|
||||
} else { // W
|
||||
l = $(containerStr + ' LI').index($(containerStr + ' LI.bgs-current')) * $(containerStr).width()*(-1);
|
||||
t = 0;
|
||||
console.log(l);
|
||||
}
|
||||
$(containerStr+' UL').css({left: l+'px', top: t+'px'});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if ($(settings.buttonNext).length || $(settings.buttonPrev).length || $(settings.pagination).length){
|
||||
if (settings.sequenceMode == 'random') {
|
||||
if(typeof(console) !== 'undefined' && console != null) {
|
||||
console.log('Don\'t use random mode width prev-button, next-button and pagination.');
|
||||
}
|
||||
} else {
|
||||
/* Prev and Next Buttons init */
|
||||
if ($(settings.buttonPrev).length){
|
||||
$(settings.buttonPrev).addClass('bgStretcherNav bgStretcherNavPrev');
|
||||
$(settings.buttonPrev).click(function(){
|
||||
$.fn.bgStretcher.buttonSlide('prev');
|
||||
});
|
||||
}
|
||||
if ($(settings.buttonNext).length){
|
||||
$(settings.buttonNext).addClass('bgStretcherNav bgStretcherNavNext');
|
||||
$(settings.buttonNext).click(function(){
|
||||
$.fn.bgStretcher.buttonSlide('next');
|
||||
});
|
||||
}
|
||||
/* Pagination */
|
||||
if ($(settings.pagination).length) {
|
||||
$.fn.bgStretcher.pagination();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* Random mode init */
|
||||
if (settings.sequenceMode == 'random') {
|
||||
var i = Math.floor(Math.random()*$(allLIs).length);
|
||||
$.fn.bgStretcher.buildRandom(i);
|
||||
if (settings.transitionEffect != 'simpleSlide') {
|
||||
$.fn.bgStretcher.settings.startElementIndex = i;
|
||||
}
|
||||
stratElement = i;
|
||||
} else {
|
||||
if ($.fn.bgStretcher.settings.startElementIndex > ($(allLIs).length - 1)) $.fn.bgStretcher.settings.startElementIndex = 0;
|
||||
stratElement = $.fn.bgStretcher.settings.startElementIndex;
|
||||
if (settings.transitionEffect == 'simpleSlide') {
|
||||
if ($.fn.bgStretcher.settings.slideDirection == 'S' || $.fn.bgStretcher.settings.slideDirection == 'E') {
|
||||
stratElement = $(allLIs).length - 1 - $.fn.bgStretcher.settings.startElementIndex;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
$(allLIs).eq(stratElement).show().addClass('bgs-current');
|
||||
$.fn.bgStretcher.loadImg($(allLIs).eq(stratElement));
|
||||
|
||||
/* Go slideshow */
|
||||
if(settings.slideShow && $(allLIs).length > 1){
|
||||
_bgStretcherTm = setTimeout('$.fn.bgStretcher.slideShow(\''+$.fn.bgStretcher.settings.sequenceMode+'\', -1)', settings.nextSlideDelay);
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
function _resize(body_content){
|
||||
var winW = 0;
|
||||
var winH = 0;
|
||||
var contH = 0;
|
||||
var contW = 0;
|
||||
|
||||
if ($('BODY').hasClass('bgStretcher-container')) {
|
||||
winW = $(window).width();
|
||||
winH = $(window).height();
|
||||
if (($.browser.msie) && (parseInt(jQuery.browser.version) == 6)) {
|
||||
$(window).scroll(function(){
|
||||
$('#'+settings.imageContainer).css('top', $(window).scrollTop());
|
||||
});
|
||||
}
|
||||
} else {
|
||||
$('.bgstretcher').css('position', 'absolute').css('top', '0px');
|
||||
winW = body_content.width();
|
||||
winH = body_content.height();
|
||||
}
|
||||
|
||||
var imgW = 0, imgH = 0;
|
||||
var leftSpace = 0;
|
||||
|
||||
// Max image size
|
||||
if(settings.maxWidth != 'auto'){
|
||||
if (winW > settings.maxWidth){
|
||||
leftSpace = (winW - settings.maxWidth)/2;
|
||||
contW = settings.maxWidth;
|
||||
} else contW = winW;
|
||||
} else contW = winW;
|
||||
if(settings.maxHeight != 'auto'){
|
||||
if (winH > settings.maxHeight){
|
||||
contH = settings.maxHeight;
|
||||
} else contH = winH;
|
||||
} else contH = winH;
|
||||
|
||||
// Update container's size
|
||||
container.width(contW);
|
||||
container.height(contH);
|
||||
|
||||
// Non-proportional resize
|
||||
if(!settings.resizeProportionally){
|
||||
imgW = contH;
|
||||
imgH = contH;
|
||||
} else {
|
||||
var initW = settings.imageWidth, initH = settings.imageHeight;
|
||||
var ratio = initH / initW;
|
||||
|
||||
imgW = contW;
|
||||
imgH = Math.round(contW * ratio);
|
||||
|
||||
if(imgH < contH){
|
||||
imgH = contH;
|
||||
imgW = Math.round(imgH / ratio);
|
||||
}
|
||||
}
|
||||
|
||||
// Anchoring
|
||||
var mar_left = 0;
|
||||
var mar_top = 0;
|
||||
var anchor_arr;
|
||||
if ($.fn.bgStretcher.settings.anchoring != 'left top') {
|
||||
anchor_arr = ($.fn.bgStretcher.settings.anchoring).split(' ');
|
||||
if (anchor_arr[0] == 'right') {
|
||||
mar_left = (winW - contW);
|
||||
} else {
|
||||
if (anchor_arr[0] == 'center') mar_left = Math.round((winW - contW)/2);
|
||||
}
|
||||
if (anchor_arr[1] == 'bottom') {
|
||||
mar_top = (winH - contH);
|
||||
} else {
|
||||
if (anchor_arr[1] == 'center') {
|
||||
mar_top = Math.round((winH - contH)/2);
|
||||
}
|
||||
}
|
||||
container.css('marginLeft', mar_left+'px').css('marginTop', mar_top+'px');
|
||||
}
|
||||
mar_left = 0;
|
||||
mar_top = 0;
|
||||
if ($.fn.bgStretcher.settings.anchoringImg != 'left top') {
|
||||
anchor_arr = ($.fn.bgStretcher.settings.anchoringImg).split(' ');
|
||||
if (anchor_arr[0] == 'right') {
|
||||
mar_left = (contW - imgW);
|
||||
} else {
|
||||
if (anchor_arr[0] == 'center') mar_left = Math.round((contW - imgW)/2);
|
||||
}
|
||||
if (anchor_arr[1] == 'bottom') {
|
||||
mar_top = (contH - imgH);
|
||||
} else {
|
||||
if (anchor_arr[1] == 'center') {
|
||||
mar_top = Math.round((contH - imgH)/2);
|
||||
}
|
||||
}
|
||||
}
|
||||
img_options['mar_left'] = mar_left;
|
||||
img_options['mar_top'] = mar_top;
|
||||
|
||||
// Apply new size for images
|
||||
if (container.find('LI:first').hasClass('swf-mode')) {
|
||||
|
||||
var path_swf = container.find('LI:first').html();
|
||||
container.find('LI:first').html('<div id="bgstretcher-flash"> </div>');
|
||||
|
||||
var header = new SWFObject('flash/stars.swf', 'flash-obj', contW, contH, '9');
|
||||
header.addParam('wmode', 'transparent');
|
||||
header.write('bgstretcher-flash');
|
||||
|
||||
};
|
||||
img_options['imgW'] = imgW;
|
||||
img_options['imgH'] = imgH;
|
||||
|
||||
if(!settings.resizeAnimate){
|
||||
container.children('UL').children('LI.img-loaded').find('IMG').css({'marginLeft': img_options["mar_left"]+'px', 'marginTop': img_options["mar_top"]+'px'});
|
||||
container.children('UL').children('LI.img-loaded').find('IMG').css({'width': img_options["imgW"]+'px', 'height': img_options["imgH"]+'px'});
|
||||
} else {
|
||||
container.children('UL').children('LI.img-loaded').find('IMG').animate({'marginLeft': img_options["mar_left"]+'px', 'marginTop': img_options["mar_top"]+'px'}, 'normal');
|
||||
container.children('UL').children('LI.img-loaded').find('IMG').animate({'width': img_options["imgW"]+'px', 'height': img_options["imgH"]+'px'}, 'normal');
|
||||
}
|
||||
|
||||
$(allLIs).width(container.width()).height(container.height());
|
||||
|
||||
if ($.fn.bgStretcher.settings.transitionEffect == 'simpleSlide') {
|
||||
if ($.fn.bgStretcher.settings.slideDirection == 'W' || $.fn.bgStretcher.settings.slideDirection == 'E') {
|
||||
container.children('UL').width(container.width() * $(allLIs).length).height(container.height());
|
||||
if ( $(containerStr + ' LI').index($(containerStr + ' LI.bgs-current')) != -1 ){
|
||||
l = $(containerStr + ' LI').index($(containerStr + ' LI.bgs-current')) * container.width()*(-1);
|
||||
container.children('UL').css({left: l+'px'});
|
||||
}
|
||||
} else {
|
||||
container.children('UL').height(container.height() * $(allLIs).length).width(container.width());
|
||||
if ( $(containerStr + ' LI').index($(containerStr + ' LI.bgs-current')) != -1 ){
|
||||
t = $(containerStr + ' LI').index($(containerStr + ' LI.bgs-current')) * $(containerStr).height()*(-1);
|
||||
container.children('UL').css({top: t+'px'});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
function _genHtml(body_content){
|
||||
var code = '';
|
||||
var cur_bgstretcher;
|
||||
|
||||
body_content.each(function(){
|
||||
$(this).wrapInner('<div class="bgstretcher-page" />').wrapInner('<div class="bgstretcher-area" />');
|
||||
code = '<div id="' + settings.imageContainer + '" class="bgstretcher"><ul>';
|
||||
// if swf
|
||||
if (settings.images.length) {
|
||||
var ext = settings.images[0].split('.');
|
||||
ext = ext[ext.length-1];
|
||||
|
||||
if (ext != 'swf') {
|
||||
var ind = 0;
|
||||
for(i = 0; i < settings.images.length; i++){
|
||||
if (settings.transitionEffect == 'simpleSlide' && settings.sequenceMode == 'back')
|
||||
ind = settings.images.length-1-i;
|
||||
else ind = i;
|
||||
if ($.fn.bgStretcher.settings.preloadImg) {
|
||||
code += '<li><span class="image-path">' + settings.images[ind] + '</span></li>';
|
||||
} else {
|
||||
code += '<li class="img-loaded"><img src="' + settings.images[ind] + '" alt="" /></li>';
|
||||
}
|
||||
}
|
||||
} else {
|
||||
code += '<li class="swf-mode">' + settings.images[0] + '</li>';
|
||||
}
|
||||
}
|
||||
|
||||
code += '</ul></div>';
|
||||
cur_bgstretcher = $(this).children('.bgstretcher-area');
|
||||
$(code).prependTo(cur_bgstretcher);
|
||||
cur_bgstretcher.css({position: 'relative'});
|
||||
cur_bgstretcher.children('.bgstretcher-page').css({'position': 'relative', 'z-index': 3});
|
||||
});
|
||||
|
||||
};
|
||||
|
||||
/* Start bgStretcher */
|
||||
this.addClass('bgStretcher-container');
|
||||
_build(this);
|
||||
};
|
||||
|
||||
$.fn.bgStretcher.loadImg = function(obj){
|
||||
if (obj.hasClass('img-loaded')) return true;
|
||||
obj.find('SPAN.image-path').each(function(){
|
||||
var imgsrc = $(this).html();
|
||||
var imgalt = '';
|
||||
var parent = $(this).parent();
|
||||
var img = new Image();
|
||||
|
||||
$(img).load(function () {
|
||||
$(this).hide();
|
||||
parent.prepend(this);
|
||||
$(this).fadeIn('100');
|
||||
}).error(function () {
|
||||
}).attr('src', imgsrc).attr('alt', imgalt);
|
||||
|
||||
$(img).css({'marginLeft': img_options["mar_left"]+'px', 'marginTop': img_options["mar_top"]+'px'});
|
||||
$(img).css({'width': img_options["imgW"]+'px', 'height': img_options["imgH"]+'px'});
|
||||
});
|
||||
obj.addClass('img-loaded');
|
||||
return true;
|
||||
}
|
||||
|
||||
$.fn.bgStretcher.play = function(){
|
||||
_bgStretcherPause = false;
|
||||
$.fn.bgStretcher._clearTimeout();
|
||||
$.fn.bgStretcher.slideShow($.fn.bgStretcher.settings.sequenceMode, -1);
|
||||
|
||||
};
|
||||
|
||||
$.fn.bgStretcher._clearTimeout = function(){
|
||||
if(_bgStretcherTm != null){
|
||||
clearTimeout(_bgStretcherTm);
|
||||
_bgStretcherTm = null;
|
||||
}
|
||||
}
|
||||
|
||||
$.fn.bgStretcher.pause = function(){
|
||||
_bgStretcherPause = true;
|
||||
$.fn.bgStretcher._clearTimeout();
|
||||
};
|
||||
|
||||
$.fn.bgStretcher.sliderDestroy = function(){
|
||||
var cont = $('.bgstretcher-page').html();
|
||||
$('.bgStretcher-container').html('').html(cont).removeClass('bgStretcher-container');
|
||||
$.fn.bgStretcher._clearTimeout();
|
||||
_bgStretcherPause = false;
|
||||
}
|
||||
|
||||
/* Slideshow */
|
||||
$.fn.bgStretcher.slideShow = function(sequence_mode, index_next){
|
||||
_bgStretcherAction = true;
|
||||
if ($(allLIs).length < 2) return true;
|
||||
var current = $(containerStr + ' LI.bgs-current');
|
||||
var next;
|
||||
|
||||
if (index_next == -1) {
|
||||
switch (sequence_mode){
|
||||
case 'back':
|
||||
next = current.prev();
|
||||
if(!next.length){ next = $(containerStr + ' LI:last'); }
|
||||
break;
|
||||
case 'random':
|
||||
if (r_image == $(containerStr + ' LI').length) {
|
||||
$.fn.bgStretcher.buildRandom(random_line[$(containerStr + ' LI').length-1]);
|
||||
r_image = 0;
|
||||
}
|
||||
next = $(containerStr + ' LI').eq(random_line[r_image]);
|
||||
r_image++;
|
||||
break;
|
||||
default:
|
||||
next = current.next();
|
||||
if(!next.length){ next = $(containerStr + ' LI:first'); }
|
||||
}
|
||||
} else {
|
||||
next = $(containerStr + ' LI').eq(index_next);
|
||||
}
|
||||
|
||||
$(containerStr + ' LI').removeClass('bgs-current');
|
||||
$.fn.bgStretcher.loadImg(next);
|
||||
next.addClass('bgs-current');
|
||||
|
||||
switch ($.fn.bgStretcher.settings.transitionEffect){
|
||||
case 'fade':
|
||||
$.fn.bgStretcher.effectFade(current, next);
|
||||
break;
|
||||
case 'simpleSlide':
|
||||
$.fn.bgStretcher.simpleSlide();
|
||||
break;
|
||||
case 'superSlide':
|
||||
$.fn.bgStretcher.superSlide(current, next, sequence_mode);
|
||||
break;
|
||||
default :
|
||||
$.fn.bgStretcher.effectNone(current, next);
|
||||
|
||||
}
|
||||
if ($($.fn.bgStretcher.settings.pagination).find('LI').length) {
|
||||
$($.fn.bgStretcher.settings.pagination).find('LI.showPage').removeClass('showPage');
|
||||
$($.fn.bgStretcher.settings.pagination).find('LI').eq($(containerStr + ' LI').index($(containerStr + ' LI.bgs-current'))).addClass('showPage');
|
||||
}
|
||||
|
||||
// callback
|
||||
if ($.fn.bgStretcher.settings.callbackfunction) {
|
||||
if(typeof $.fn.bgStretcher.settings.callbackfunction == 'function')
|
||||
$.fn.bgStretcher.settings.callbackfunction.call();
|
||||
}
|
||||
|
||||
if(!_bgStretcherPause){
|
||||
_bgStretcherTm = setTimeout('$.fn.bgStretcher.slideShow(\''+$.fn.bgStretcher.settings.sequenceMode+'\', -1)', $.fn.bgStretcher.settings.nextSlideDelay);
|
||||
}
|
||||
};
|
||||
|
||||
/* Others effects */
|
||||
$.fn.bgStretcher.effectNone = function(current, next){
|
||||
next.show();
|
||||
current.hide();
|
||||
_bgStretcherAction = false;
|
||||
};
|
||||
$.fn.bgStretcher.effectFade = function(current, next){
|
||||
next.fadeIn( $.fn.bgStretcher.settings.slideShowSpeed );
|
||||
current.fadeOut( $.fn.bgStretcher.settings.slideShowSpeed, function(){
|
||||
_bgStretcherAction = false;
|
||||
} );
|
||||
};
|
||||
|
||||
$.fn.bgStretcher.simpleSlide = function(){
|
||||
var t, l;
|
||||
switch ($.fn.bgStretcher.settings.slideDirection) {
|
||||
case 'N':
|
||||
case 'S':
|
||||
t = $(containerStr + ' LI').index($(containerStr + ' LI.bgs-current')) * $(containerStr).height()*(-1);
|
||||
l = 0;
|
||||
break;
|
||||
default:
|
||||
l = $(containerStr + ' LI').index($(containerStr + ' LI.bgs-current')) * $(containerStr).width()*(-1);
|
||||
t = 0;
|
||||
}
|
||||
$(containerStr+' UL').animate({left: l+'px', top: t+'px'}, $.fn.bgStretcher.settings.slideShowSpeed, function(){
|
||||
_bgStretcherAction = false;
|
||||
});
|
||||
|
||||
};
|
||||
|
||||
$.fn.bgStretcher.superSlide = function(current, next, sequence_mode){
|
||||
var t, l;
|
||||
switch ($.fn.bgStretcher.settings.slideDirection) {
|
||||
case 'S':
|
||||
t = $(containerStr).height();
|
||||
l = 0;
|
||||
break;
|
||||
case 'E':
|
||||
t = 0;
|
||||
l = $(containerStr).width();
|
||||
break;
|
||||
case 'W':
|
||||
t = 0;
|
||||
l = $(containerStr).width()*(-1);
|
||||
break;
|
||||
case 'NW':
|
||||
t = $(containerStr).height()*(-1);
|
||||
l = $(containerStr).width()*(-1);
|
||||
break;
|
||||
case 'NE':
|
||||
t = $(containerStr).height()*(-1);
|
||||
l = $(containerStr).width();
|
||||
break;
|
||||
case 'SW':
|
||||
t = $(containerStr).height();
|
||||
l = $(containerStr).width()*(-1);
|
||||
break;
|
||||
case 'SE':
|
||||
t = $(containerStr).height();
|
||||
l = $(containerStr).width();
|
||||
break;
|
||||
default:
|
||||
t = $(containerStr).height()*(-1);
|
||||
l = 0;
|
||||
|
||||
}
|
||||
|
||||
if (sequence_mode == 'back') {
|
||||
next.css({'z-index': 2, top: t+'px', left: l+'px'});
|
||||
next.show();
|
||||
next.animate({left: '0px', top: '0px'}, $.fn.bgStretcher.settings.slideShowSpeed, function(){
|
||||
current.hide();
|
||||
$(this).css({'z-index': 1});
|
||||
_bgStretcherAction = false;
|
||||
});
|
||||
} else {
|
||||
current.css('z-index', 2);
|
||||
next.show();
|
||||
current.animate({left: l+'px', top: t+'px'}, $.fn.bgStretcher.settings.slideShowSpeed, function(){
|
||||
$(this).hide().css({'z-index': 1, top: '0px', left: '0px'});
|
||||
_bgStretcherAction = false;
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
/* Build line random images */
|
||||
$.fn.bgStretcher.buildRandom = function(el_not){
|
||||
var l = $(allLIs).length;
|
||||
var i, j, rt;
|
||||
for (i = 0; i < l; i++ ) {
|
||||
random_line[i] = i;
|
||||
random_temp[i] = Math.random()*l;
|
||||
}
|
||||
for (i = 0; i < l; i++ ) {
|
||||
for (j = 0; j < (l-i-1); j++) {
|
||||
if (random_temp[j] > random_temp[j+1]) {
|
||||
rt = random_temp[j];
|
||||
random_temp[j] = random_temp[j+1];
|
||||
random_temp[j+1] = rt;
|
||||
rt = random_line[j];
|
||||
random_line[j] = random_line[j+1];
|
||||
random_line[j+1] = rt;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (random_line[0] == el_not) {
|
||||
rt = random_line[0];
|
||||
random_line[0] = random_line[l-1];
|
||||
random_line[l-1] = rt;
|
||||
}
|
||||
};
|
||||
|
||||
/* Prev and Next buttons */
|
||||
$.fn.bgStretcher.buttonSlide = function(button_point){
|
||||
if (_bgStretcherAction || ($(allLIs).length < 2)) return false;
|
||||
var mode = '';
|
||||
if (button_point == 'prev') {
|
||||
mode = 'back';
|
||||
if ($.fn.bgStretcher.settings.sequenceMode == 'back') mode = 'normal';
|
||||
} else {
|
||||
mode = $.fn.bgStretcher.settings.sequenceMode;
|
||||
}
|
||||
$(allLIs).stop(true, true);
|
||||
$.fn.bgStretcher._clearTimeout();
|
||||
$.fn.bgStretcher.slideShow(mode, -1);
|
||||
return false;
|
||||
};
|
||||
|
||||
/* Pagination */
|
||||
$.fn.bgStretcher.pagination = function(){
|
||||
var l = $(allLIs).length;
|
||||
var output = ''; var i = 0;
|
||||
if (l > 0) {
|
||||
output += '<ul>';
|
||||
for (i = 0; i < l; i++){
|
||||
output += '<li><a href="javascript:;">'+(i+1)+'</a></li>';
|
||||
}
|
||||
output += '</ul>';
|
||||
$($.fn.bgStretcher.settings.pagination).html(output);
|
||||
$($.fn.bgStretcher.settings.pagination).find('LI:first').addClass('showPage');
|
||||
|
||||
$($.fn.bgStretcher.settings.pagination).find('A').click(function(){
|
||||
if ($(this).parent().hasClass('showPage')) return false;
|
||||
$(allLIs).stop(true, true);
|
||||
$.fn.bgStretcher._clearTimeout();
|
||||
$.fn.bgStretcher.slideShow($.fn.bgStretcher.settings.sequenceMode, $($.fn.bgStretcher.settings.pagination).find('A').index($(this)));
|
||||
return false;
|
||||
});
|
||||
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
/* Default Settings */
|
||||
$.fn.bgStretcher.defaults = {
|
||||
imageContainer: 'bgstretcher',
|
||||
resizeProportionally: true,
|
||||
resizeAnimate: false,
|
||||
images: [],
|
||||
imageWidth: 1024,
|
||||
imageHeight: 768,
|
||||
maxWidth: 'auto',
|
||||
maxHeight: 'auto',
|
||||
nextSlideDelay: 3000,
|
||||
slideShowSpeed: 'normal',
|
||||
slideShow: true,
|
||||
transitionEffect: 'fade', // none, fade, simpleSlide, superSlide
|
||||
slideDirection: 'N', // N, S, W, E, (if superSlide - NW, NE, SW, SE)
|
||||
sequenceMode: 'normal', // back, random
|
||||
buttonPrev: '',
|
||||
buttonNext: '',
|
||||
pagination: '',
|
||||
anchoring: 'left top', // right bottom center
|
||||
anchoringImg: 'left top', // right bottom center
|
||||
preloadImg: false,
|
||||
startElementIndex: 0,
|
||||
callbackfunction: null
|
||||
};
|
||||
$.fn.bgStretcher.settings = {};
|
||||
})(jQuery);
|
||||
@@ -0,0 +1,154 @@
|
||||
function drawCircle(obj) {
|
||||
var drawing_elem = document.getElementById(obj.drawing_elem);
|
||||
var width = drawing_elem.width;
|
||||
var height = drawing_elem.height;
|
||||
var percent = +drawing_elem.getAttribute("data-value");
|
||||
var percentfontcolor = obj.percentfontcolor;
|
||||
var unitfontcolor = obj.unitfontcolor;
|
||||
var percentfontsize = obj.percentfontsize || 15;
|
||||
var unitfontsize = obj.unitfontsize || 15;
|
||||
var unitvalue = obj.unitvalue || "%";
|
||||
var bgcolor = obj.bgcolor || "";
|
||||
var forecolor = obj.forecolor;
|
||||
var lineWidth = obj.lineWidth || 12;
|
||||
var speedstep = obj.speedstep || 3;
|
||||
var addLeft = obj.addLeft || 0;
|
||||
var lineGap = obj.lineGap || "";
|
||||
var center_x = width / 2;
|
||||
var center_y = height / 2;
|
||||
var rad = obj.rad || (Math.PI * 2) / 100;
|
||||
var radStart = obj.radStart || 0;
|
||||
var radEnd = obj.radEnd || Math.PI * 2;
|
||||
var radDrawStart = obj.radDrawStart || (-Math.PI * 1) / 2;
|
||||
var unitadd = obj.unitadd || (-Math.PI * 1) / 2;
|
||||
var speed = 0;
|
||||
|
||||
var context = drawing_elem.getContext("2d");
|
||||
|
||||
// 绘制背景圆圈
|
||||
function drawOuterCircle() {
|
||||
context.save();
|
||||
context.lineWidth = lineWidth;
|
||||
var radius = center_x - context.lineWidth;
|
||||
if (Object.prototype.toString.call(bgcolor) === "[object Array]") {
|
||||
var gradient = context.createLinearGradient(height, 0, 0, 0);
|
||||
bgcolor.forEach(function (item) {
|
||||
gradient.addColorStop(item.step, item.color);
|
||||
});
|
||||
context.strokeStyle = gradient;
|
||||
} else {
|
||||
context.strokeStyle = bgcolor;
|
||||
}
|
||||
if (lineGap) {
|
||||
context.lineCap = lineGap;
|
||||
}
|
||||
context.beginPath();
|
||||
context.arc(center_x, center_y, radius, radStart, radEnd, false);
|
||||
context.stroke();
|
||||
context.closePath();
|
||||
context.restore();
|
||||
}
|
||||
|
||||
//绘制运动圆环
|
||||
function drawInnerCircle(n) {
|
||||
context.save();
|
||||
context.lineWidth = lineWidth;
|
||||
var radius = center_x - context.lineWidth;
|
||||
if (Object.prototype.toString.call(forecolor) === "[object Array]") {
|
||||
var gradient = context.createLinearGradient(height, 0, 0, 0);
|
||||
forecolor.forEach(function (item) {
|
||||
gradient.addColorStop(item.step, item.color);
|
||||
});
|
||||
context.strokeStyle = gradient;
|
||||
} else {
|
||||
context.strokeStyle = forecolor;
|
||||
}
|
||||
if (lineGap) {
|
||||
context.lineCap = lineGap;
|
||||
}
|
||||
context.beginPath();
|
||||
context.arc(
|
||||
center_x,
|
||||
center_y,
|
||||
radius,
|
||||
radDrawStart,
|
||||
radDrawStart + n * rad,
|
||||
false
|
||||
);
|
||||
context.stroke();
|
||||
context.closePath();
|
||||
context.restore();
|
||||
}
|
||||
|
||||
//绘制文字
|
||||
function drawText(n) {
|
||||
//声明%
|
||||
context.save();
|
||||
context.font = unitfontsize + "px Helvetica";
|
||||
var text1_width = context.measureText(unitvalue).width;
|
||||
context.restore();
|
||||
|
||||
//绘制数字
|
||||
context.save();
|
||||
var font_size = percentfontsize;
|
||||
var text_value = "";
|
||||
if (n % parseInt(n) > 0 && n % parseInt(n) < 1) {
|
||||
text_value = n.toFixed(2);
|
||||
} else if (n % parseInt(n) === 0 || n == 0) {
|
||||
text_value = n.toFixed(0);
|
||||
}
|
||||
context.fillStyle = percentfontcolor;
|
||||
context.font = font_size + "px Helvetica";
|
||||
var text_width = context.measureText(text_value).width;
|
||||
context.fillText(
|
||||
text_value,
|
||||
center_x - text_width / 2 - text1_width / 2 + addLeft,
|
||||
center_y + font_size / 2
|
||||
);
|
||||
context.restore();
|
||||
|
||||
//绘制%
|
||||
context.save();
|
||||
context.fillStyle = unitfontcolor;
|
||||
context.fillText(
|
||||
unitvalue,
|
||||
center_x - text_width / 2 + text_width - text1_width / 2 + addLeft,
|
||||
center_y + unitfontsize / 2 + unitadd
|
||||
);
|
||||
context.restore();
|
||||
}
|
||||
|
||||
// 绘制
|
||||
function startDraw(speed) {
|
||||
context.save();
|
||||
context.clearRect(0, 0, width, height);
|
||||
if (bgcolor) {
|
||||
drawOuterCircle();
|
||||
}
|
||||
drawText(speed);
|
||||
if (speed != 0) {
|
||||
drawInnerCircle(speed);
|
||||
}
|
||||
context.restore();
|
||||
}
|
||||
|
||||
// 执行动画
|
||||
(function drawFrame() {
|
||||
if (percent == 0) {
|
||||
startDraw(speed);
|
||||
return;
|
||||
}
|
||||
if (speed >= percent) {
|
||||
speed = percent;
|
||||
startDraw(speed);
|
||||
return;
|
||||
}
|
||||
if (percent - speed >= speedstep) {
|
||||
speed += speedstep;
|
||||
} else {
|
||||
speed += percent - speed;
|
||||
}
|
||||
startDraw(speed);
|
||||
window.requestAnimationFrame(drawFrame);
|
||||
})();
|
||||
}
|
||||
@@ -0,0 +1,187 @@
|
||||
/*
|
||||
http://www.rjboy.cn
|
||||
By sean at 2010.06 - 2011.03
|
||||
|
||||
Demo:
|
||||
$(".container").hScrollPane({
|
||||
mover:".press", //指定container对象下的哪个元素需要滚动位置 | 必传项;
|
||||
moverW:function(){return $(".press").width();}(), //传入水平滚动对象的长度值,不传入的话默认直接获取mover的宽度值 | 可选项;
|
||||
handleMinWidth:300, //指定handle的最小宽度,要固定handle的宽度请在css中设定handle的width属性(如 width:28px!important;),不传入则不设定最小宽度 | 可选项;
|
||||
showArrow:true, //指定是否显示左右箭头,默认不显示 | 可选项;
|
||||
dragable:false, //指定是否要支持拖动效果,默认可以拖动 | 可选项;
|
||||
handleCssAlter:"draghandlealter", //指定拖动鼠标时滚动条的样式,不传入该参数则没有变化效果 | 可选项;
|
||||
easing:true, //滚动是否需要滑动效果,默认有滑动效果 | 可选项;
|
||||
mousewheel:{bind:true,moveLength:500} //mousewheel: bind->'true',绑定mousewheel事件; ->'false',不绑定mousewheel事件;moveLength是指定鼠标滚动一次移动的距离,默认值:{bind:true,moveLength:300} | 可选项;
|
||||
});
|
||||
*/
|
||||
|
||||
(function($){
|
||||
$.extend(jQuery.easing,{
|
||||
easeOutQuint: function (x, t, b, c, d) {
|
||||
return c*((t=t/d-1)*t*t*t*t + 1) + b;
|
||||
}
|
||||
});
|
||||
|
||||
$.fn.hScrollPane=function(settings){
|
||||
settings=$.extend(true,{},$.fn.hScrollPane.defaults,settings);
|
||||
this.each(function(){
|
||||
var container=$(this),
|
||||
mover=container.find(settings.mover),
|
||||
w=container.width(),
|
||||
c=settings.moverW || mover.width(),
|
||||
dragbar=(container.find(".hScrollPane_dragbar").length==0 && c>w ) ? container.append('<div class="hScrollPane_dragbar"><div class="hScrollPane_draghandle"></div></div>').find(".hScrollPane_dragbar") : container.find(".hScrollPane_dragbar"),//避免多次初始化时的重复append;
|
||||
handle=dragbar.find(".hScrollPane_draghandle");
|
||||
|
||||
if(settings.showArrow){
|
||||
container.append('<a href="###" class="hScrollPane_leftarrow"></a><a href="###" class="hScrollPane_rightarrow"></a>');
|
||||
leftArrow=container.find(".hScrollPane_leftarrow");
|
||||
rightArrow=container.find(".hScrollPane_rightarrow");
|
||||
dragbar.css({
|
||||
width:container.width()-leftArrow.outerWidth()*2,
|
||||
left:leftArrow.outerWidth()
|
||||
});
|
||||
leftArrow.unbind();
|
||||
rightArrow.unbind();
|
||||
}else{
|
||||
dragbar.css("width",container.width());
|
||||
}
|
||||
|
||||
mover.stop().css("left","0px");
|
||||
container.unbind();//避免多次初始化时的事件重复绑定;
|
||||
handle.unbind();
|
||||
dragbar.unbind();
|
||||
|
||||
handle.stop().css({
|
||||
width:(w/c)*w >settings.handleMinWidth ? (w/c)*w : settings.handleMinWidth,
|
||||
left:0
|
||||
});
|
||||
|
||||
if(c<w){
|
||||
dragbar.hide();
|
||||
return false;
|
||||
}else{
|
||||
dragbar.show();
|
||||
}
|
||||
|
||||
// 添加
|
||||
container.bind("mouseenter", function(e){
|
||||
console.log('hover')
|
||||
dragbar.css('opacity', 1);
|
||||
})
|
||||
|
||||
container.bind("mouseleave", function(e){
|
||||
dragbar.css('opacity', 0);
|
||||
console.log('hover1')
|
||||
return false;
|
||||
})
|
||||
|
||||
//
|
||||
|
||||
|
||||
var maxlen=parseInt(dragbar.width())-parseInt(handle.outerWidth());
|
||||
|
||||
dragbar.bind("click",function(e){
|
||||
var flag=e.pageX>handle.offset().left+handle.outerWidth() ? -1 : 1;
|
||||
$.fn.hScrollPane.move(settings,mover,handle,w,c,maxlen,flag);
|
||||
});
|
||||
|
||||
handle.bind("mousedown",function(e){
|
||||
var x=e.pageX;
|
||||
var hx=parseInt(handle.css("left"));
|
||||
if(settings.handleCssAlter){$(this).addClass(settings.handleCssAlter);}
|
||||
|
||||
$(document).bind("mousemove",function(e){
|
||||
var left=e.pageX-x+hx<0?0:(e.pageX-x+hx>=maxlen?maxlen:e.pageX-x+hx);
|
||||
handle.stop().css({left:left});
|
||||
if(settings.easing){
|
||||
mover.stop().animate({
|
||||
left:-left/maxlen*(c-w)
|
||||
},{duration:1500,easing:'easeOutQuint',queue:false});
|
||||
}else{
|
||||
mover.css({left:-left/maxlen*(c-w)});
|
||||
}
|
||||
|
||||
return false;
|
||||
});
|
||||
$(document).bind("mouseup",function(){
|
||||
if(settings.handleCssAlter){handle.removeClass(settings.handleCssAlter);}
|
||||
$(this).unbind("mousemove");
|
||||
})
|
||||
return false;
|
||||
}).click(function(){
|
||||
return false;
|
||||
})
|
||||
|
||||
if(settings.dragable){
|
||||
mover.bind("mousedown",function(e){
|
||||
var x=e.pageX;
|
||||
$(this).bind("mousemove",function(e){
|
||||
$.fn.hScrollPane.move(settings,mover,handle,w,c,maxlen,x,e.pageX);
|
||||
return false;
|
||||
})
|
||||
$(document).bind("mouseup",function(){
|
||||
mover.unbind("mousemove");
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
if(settings.mousewheel.bind){
|
||||
container.bind("mousewheel",function(event, delta){
|
||||
$.fn.hScrollPane.move(settings,mover,handle,w,c,maxlen,delta);
|
||||
return false;
|
||||
});
|
||||
}
|
||||
|
||||
if(settings.showArrow){
|
||||
leftArrow.click(function(){
|
||||
$.fn.hScrollPane.move(settings,mover,handle,w,c,maxlen,1);
|
||||
return false;
|
||||
}).focus(function(){this.blur();});
|
||||
|
||||
rightArrow.click(function(){
|
||||
$.fn.hScrollPane.move(settings,mover,handle,w,c,maxlen,-1);
|
||||
return false;
|
||||
}).focus(function(){this.blur();});
|
||||
}
|
||||
|
||||
this.ondragstart=function(){return false;}
|
||||
this.onselectstart=function(){return false;}
|
||||
|
||||
})
|
||||
}
|
||||
|
||||
$.fn.hScrollPane.defaults = {
|
||||
showArrow:false,
|
||||
handleMinWidth:0,
|
||||
dragable:true,
|
||||
easing:true,
|
||||
mousewheel:{bind:true,moveLength:300}
|
||||
};
|
||||
|
||||
$.fn.hScrollPane.move=function(settings,mover,handle,w,c,maxlen,x,nx){
|
||||
if(arguments.length==7){
|
||||
var left=parseInt(mover.css("left"))+x*settings.mousewheel.moveLength;
|
||||
}else{
|
||||
var left=parseInt(mover.css("left"))+((nx-x)/w)*(c-w);
|
||||
}
|
||||
left=left.toFixed(0);
|
||||
left=left>0?0:left<w-c?w-c:left;
|
||||
var handle_left=(left/(w-c))*maxlen;
|
||||
|
||||
if(settings.easing){
|
||||
mover.stop().animate({
|
||||
left:left
|
||||
},{duration:1500,easing:'easeOutQuint',queue:false});
|
||||
|
||||
handle.stop().animate({
|
||||
left:handle_left
|
||||
},{duration:1500,easing:'easeOutQuint',queue:false});
|
||||
}else{
|
||||
mover.stop().animate({
|
||||
left:left
|
||||
},{duration:5,queue:false});
|
||||
|
||||
handle.css({left:handle_left});
|
||||
}
|
||||
}
|
||||
})(jQuery);
|
||||
@@ -0,0 +1,8 @@
|
||||
/*!
|
||||
* jQuery Mousewheel 3.1.13
|
||||
*
|
||||
* Copyright 2015 jQuery Foundation and other contributors
|
||||
* Released under the MIT license.
|
||||
* http://jquery.org/license
|
||||
*/
|
||||
!function(a){"function"==typeof define&&define.amd?define(["jquery"],a):"object"==typeof exports?module.exports=a:a(jQuery)}(function(a){function b(b){var g=b||window.event,h=i.call(arguments,1),j=0,l=0,m=0,n=0,o=0,p=0;if(b=a.event.fix(g),b.type="mousewheel","detail"in g&&(m=-1*g.detail),"wheelDelta"in g&&(m=g.wheelDelta),"wheelDeltaY"in g&&(m=g.wheelDeltaY),"wheelDeltaX"in g&&(l=-1*g.wheelDeltaX),"axis"in g&&g.axis===g.HORIZONTAL_AXIS&&(l=-1*m,m=0),j=0===m?l:m,"deltaY"in g&&(m=-1*g.deltaY,j=m),"deltaX"in g&&(l=g.deltaX,0===m&&(j=-1*l)),0!==m||0!==l){if(1===g.deltaMode){var q=a.data(this,"mousewheel-line-height");j*=q,m*=q,l*=q}else if(2===g.deltaMode){var r=a.data(this,"mousewheel-page-height");j*=r,m*=r,l*=r}if(n=Math.max(Math.abs(m),Math.abs(l)),(!f||f>n)&&(f=n,d(g,n)&&(f/=40)),d(g,n)&&(j/=40,l/=40,m/=40),j=Math[j>=1?"floor":"ceil"](j/f),l=Math[l>=1?"floor":"ceil"](l/f),m=Math[m>=1?"floor":"ceil"](m/f),k.settings.normalizeOffset&&this.getBoundingClientRect){var s=this.getBoundingClientRect();o=b.clientX-s.left,p=b.clientY-s.top}return b.deltaX=l,b.deltaY=m,b.deltaFactor=f,b.offsetX=o,b.offsetY=p,b.deltaMode=0,h.unshift(b,j,l,m),e&&clearTimeout(e),e=setTimeout(c,200),(a.event.dispatch||a.event.handle).apply(this,h)}}function c(){f=null}function d(a,b){return k.settings.adjustOldDeltas&&"mousewheel"===a.type&&b%120===0}var e,f,g=["wheel","mousewheel","DOMMouseScroll","MozMousePixelScroll"],h="onwheel"in document||document.documentMode>=9?["wheel"]:["mousewheel","DomMouseScroll","MozMousePixelScroll"],i=Array.prototype.slice;if(a.event.fixHooks)for(var j=g.length;j;)a.event.fixHooks[g[--j]]=a.event.mouseHooks;var k=a.event.special.mousewheel={version:"3.1.12",setup:function(){if(this.addEventListener)for(var c=h.length;c;)this.addEventListener(h[--c],b,!1);else this.onmousewheel=b;a.data(this,"mousewheel-line-height",k.getLineHeight(this)),a.data(this,"mousewheel-page-height",k.getPageHeight(this))},teardown:function(){if(this.removeEventListener)for(var c=h.length;c;)this.removeEventListener(h[--c],b,!1);else this.onmousewheel=null;a.removeData(this,"mousewheel-line-height"),a.removeData(this,"mousewheel-page-height")},getLineHeight:function(b){var c=a(b),d=c["offsetParent"in a.fn?"offsetParent":"parent"]();return d.length||(d=a("body")),parseInt(d.css("fontSize"),10)||parseInt(c.css("fontSize"),10)||16},getPageHeight:function(b){return a(b).height()},settings:{adjustOldDeltas:!0,normalizeOffset:!0}};a.fn.extend({mousewheel:function(a){return a?this.bind("mousewheel",a):this.trigger("mousewheel")},unmousewheel:function(a){return this.unbind("mousewheel",a)}})});
|
||||