“Template:Mouse-ripple”与“Template:Mouse-ripple/styles.css”:页面之间的差异
(页面间差异)
跳到导航
跳到搜索
imported>=海豚= 无编辑摘要 |
imported>=海豚= 无编辑摘要 |
||
第1行: | 第1行: | ||
a, | |||
pre, | |||
code, | |||
.noripple, | |||
.heimu, | |||
.hover { | |||
position: relative !important; | |||
z-index: 99; | |||
} | |||
.mouse-ripple { | |||
width: 100%; | |||
height: 100%; | |||
position: fixed; | |||
top: 0; | |||
left: 0; | |||
} | |||
.mouse-ripple b { | |||
display: block; | |||
} | |||
.mouse-ripple .a { | |||
height: 2vw; | |||
} | |||
.mouse-ripple .a .b { | |||
width: 2vw; | |||
height: 2vw; | |||
display: inline-block; | |||
overflow: hidden; | |||
opacity: 0.7; | |||
} | |||
.mouse-ripple .a .b>b { | |||
height: 100%; | |||
border-radius: 50%; | |||
overflow: hidden; | |||
transition: all 0.5s; | |||
transform: scale(0); | |||
opacity: 0; | |||
} | |||
.mouse-ripple .a .b>b::before { | |||
content: ''; | |||
width: 100%; | |||
height: 100%; | |||
display: block; | |||
box-sizing: border-box; | |||
border-color: inherit; | |||
border: 1vw solid; | |||
} | |||
.mouse-ripple .a .b:hover b { | |||
transition-duration: 0s; | |||
transform: scale(1); | |||
opacity: 1; | |||
} |
2021年6月26日 (六) 15:15的最新版本
a,
pre,
code,
.noripple,
.heimu,
.hover {
position: relative !important;
z-index: 99;
}
.mouse-ripple {
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
}
.mouse-ripple b {
display: block;
}
.mouse-ripple .a {
height: 2vw;
}
.mouse-ripple .a .b {
width: 2vw;
height: 2vw;
display: inline-block;
overflow: hidden;
opacity: 0.7;
}
.mouse-ripple .a .b>b {
height: 100%;
border-radius: 50%;
overflow: hidden;
transition: all 0.5s;
transform: scale(0);
opacity: 0;
}
.mouse-ripple .a .b>b::before {
content: '';
width: 100%;
height: 100%;
display: block;
box-sizing: border-box;
border-color: inherit;
border: 1vw solid;
}
.mouse-ripple .a .b:hover b {
transition-duration: 0s;
transform: scale(1);
opacity: 1;
}