Skip to content

X
xzxt-shiro
Commit 198094b5 by zhaoshaonan
Options

修改样式

parent a7934349
Showing with 162 additions and 17 deletions
src/main/webapp/resources/h-ui/css/new-wrap.css
......@@ -60,11 +60,11 @@ body .window-mask{background: rgba(0, 0, 0, 0.5);}
body .layui-form-onswitch{border-color: #1E9FFF; background-color: #1E9FFF;}
body .layui-laypage .layui-laypage-curr .layui-laypage-em{background-color:#1E9FFF;}
body .x-nav .layui-btn{background-color:#1E9FFF;}
.layui-layer-shade{background: rgba(0, 0, 0, 0.3)!important;}
.layui-layer-shade{background: rgba(0, 0, 0, 0.6)!important;}
body input.code-icon{ background: rgba(0,0,0,0.3) url(../../image/code.gif) no-repeat right center;cursor: pointer;}
body .layui-anim-upbit>dd,body option{color:#000 !important;background: #fff !important;}
/*个人资料*/
.grzl-mp{width:400px;border:1px solid #ccc;box-shadow: 2px 2px 12px rgba(0,0,0,0.4);float: left}
.grzl-mp{width:400px;border:1px solid #666;box-shadow: 2px 2px 12px rgba(0,0,0,0.4);float: left;margin: 20px 0 0 100px;}
.mp-photo{width:100%;height:150px;background: rgba(0,0,0,0.3);position: relative;margin-bottom: 40px;}
.grzl-mp p{line-height: 40px;}
.photo-img{width:120px;position: absolute;left:50%;margin-left:-60px;bottom:-39px;}
......@@ -80,13 +80,18 @@ body .layui-layer-btn1{color:#666 !important;}
.flowChart {
background-color: rgba(0, 0, 0,0.3);
width:540px;
position: relative;
float: left;
margin-top:20px;
margin-left:100px;
padding: 12px;
display: flex;
/* display: flex;*/
}
.flowChart-left {
width: 50px;
flex-shrink: 0;
position: absolute;
height: 95%;
}
.flowChart .dashed {
width: 0px;
......@@ -98,18 +103,21 @@ body .layui-layer-btn1{color:#666 !important;}
}
.flowChart-right {
flex-grow: 1;
margin-left: 46px;
}
.flowChart .oneNode {
display: flex;
align-items: center;
width: 100%;
margin-top: 26px;
margin-bottom: 14px;
}
.flowChart .check {
width: 40px;
height: 40px;
width: 50px;
margin-right: 2px;
height: 50px;
border-radius: 50px;
line-height: 40px;
line-height: 50px;
color: white;
font-size: 12px;
text-align: center;
......@@ -136,19 +144,21 @@ body .layui-layer-btn1{color:#666 !important;}
border: 4px solid rgba(255, 208, 122,1);
}
.flowChart .NodeDetail {
background-color: white;
background-color: rgba(0, 0, 0,0.3);
margin-left: -60px;
position: relative;
z-index: 10000;
flex-grow: 1;
border: 1px solid gainsboro;
border: 1px solid #010101;
border-radius: 3px;
padding: 14px;
display: flex;
flex-direction: column;
box-shadow: 1px 1px 3px gainsboro;
box-shadow: 1px 1px 3px #4d4c4c;
}
.flowChart img {
width: 40px;
height: 40px;
width: 50px;
height: 50px;
border-radius: 20px;
}
.NodeDetail .details {
......@@ -170,7 +180,6 @@ body .layui-layer-btn1{color:#666 !important;}
flex-grow: 1;
}
.NodeDetail-content p {
text-indent: 2em;
text-align: justify;
font-size: 14px;
}
......@@ -185,13 +194,16 @@ body .layui-layer-btn1{color:#666 !important;}
}
.badge {
padding: 2px 5px;
margin:5px 8px;
font-size: 12px;
display: inline-block;
background-color: rgb(72, 108, 160);
border-radius: 10px;
font-weight: 100;
color: white;
letter-spacing: 2px;
box-shadow: 1px 1px 1px gainsboro;
white-space: nowrap;
}
.BadgeGray {
background-color: rgb(104, 108, 104);
......@@ -201,21 +213,22 @@ body .layui-layer-btn1{color:#666 !important;}
height: 0;
border: 14px solid;
border-style: dashed;
border-color: transparent white transparent transparent;
border-color: transparent rgba(0, 0, 0,0.44) transparent transparent;
position: absolute;
left: -13px;
left: -15px;
top: -14px;
z-index: 10;
}
.tag-boder {
width: 0;
height: 0;
border: 12px solid;
border-style: dashed;
border-color: transparent gainsboro transparent transparent;
border-color: transparent rgba(0, 0, 0,0.44) transparent transparent;
position: relative;
left: -59px;
left: -61px;
}
.NodeDetail-content p{
margin-top: 7px;
}
.layui-laydate span{color:#000 !important;}
src/main/webapp/resources/h-ui/js/new-wrap.js 0 → 100644
/**
* Created by founder on 2018/9/12.
*/
var isOk=false;
$(function(){
getPhotoIndex();
imgHover();
var li=$(".wait_photo").children("div");
li.slideToggle(1200);
});
$(window).resize(function(){
getPhotoIndex();
});
var index_photo=1;
$(window).scroll(function(){
/*if($(document).height() - $(this).scrollTop() - $(this).height()<19){
var allSize_s=$("#allSize_s").val();
if(index_photo<5 && allSize_s >15 ){
$("#laode_photo").show();
showFoot();
}
}*/
if($(document).height() - $(this).scrollTop() - $(this).height()<20 ){
loadimg();
}
});
function getPhotoIndex(){
var li=$(".wait_photo").children("div");
for(var i=0;i<li.length;i++){
if(i%30 == 0 || i%30 == 6 || i%30 == 12 || i%30 == 15 || i%30 == 21 || i%30 == 27){
li.eq(i).addClass("page_photo");
li.eq(i).find("img").addClass("phototop");
var src=li.eq(i).find("img").attr("src").replace(/m10/,"m0");
li.eq(i).find("img").eq(0).attr("src",src);
}else if(i%30 == 9 || i%30 == 13 || i%30 == 24 || i%30 == 28 ){
var img_top=li.eq(i).find("img").height();
if(screen.width <=1024){
img_top=img_top+5;
}
li.eq(i).css("margin-top","-"+img_top+"px");
}else if( i%30 == 14 || i%30 == 29){
var img_left=li.eq(i).find("img").width()+10;
var img_top=li.eq(i).find("img").height();
if(screen.width <=1024){
img_top=img_top+4;
}
li.eq(i).css({"margin-left": img_left+"px","margin-top":"-"+img_top+"px"});
}else if(i%30 == 12 || i%30 == 27){
li.eq(i).css("height","454px");
}
}
if((screen.width >= 1024)){
$(".wait_photo p a").each(function(){
maxwidth=15;
if(getLenght($(this).text())>maxwidth){
$(".explain_open").css("display","block");
$(this).text($(this).text().substring(0,maxwidth));
$(this).html($(this).html()+'……');
}
});
}else{
$(".wait_photo p a").each(function(){
maxwidth=12; if(getLenght($(this).text())>maxwidth){
$(".explain_open").css("display","block");
$(this).text($(this).text().substring(0,maxwidth));
$(this).html($(this).html()+'……');
}
});
}
}
function imgHover(){
$('.wait_photo li img').hover(function(){
var $this = $(this);
$this.stop().animate({'opacity':'0.8','top':'0px','left':'0px'});
},function(){
var $this = $(this);
$this.stop().animate({'opacity':'1.0','top':'-66.5px','left':'-150px'});
});
}
var number=0;
function loadimg(){
if(!isOk){
isOk=true;
for(var i=0;i<10;i++){
var text=" <li class='photo_li"+index_photo+"'><a><img src='images/pro_1.jpg' /></a> <p> " +
" <span> <a ><img src='images/head1.jpg' style='width: 24px; height: 24px;'>" +
"</a> <a >我的作品</a><br /> </span> </p> </li>";
$(".wait_photo li").last().after(text);
getPhotoIndex();
}
$(".wait_photo .photo_li"+index_photo).slideToggle(1500);
index_photo++;
imgHover();
setTimeout("iSPhoto()",1000);
}
}
function iSPhoto(){
isOk=false
}
function getLenght(str){
entryVal=str;
entryLen=entryVal.length;
var cnArr=[];
for(var i=0;i<entryVal.length;i++){
if(entryVal.charCodeAt(i)>255){//遍历判断字符串中每个字符的Unicode码,大于255则为中文
cnArr.push(entryVal[i]);//讲符合条件的值插入到中文字符数组中
}
}
entryLen+=cnArr.length;
return entryLen;
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment