css实现双击长方形显示动画效果代码
代码语言:html
所属分类:动画
代码描述:css实现双击长方形显示动画效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<style>
body {
overflow: hidden;
}
.wrapper,
.animDiv {
position: absolute;
inset: 0;
background-color: lightgrey;
}
.animDiv {
-webkit-animation: wipeAnimation 700ms ease-out both,
cycleColors_01 1000ms linear infinite;
animation: wipeAnimation 700ms ease-out both,
cycleColors_01 1000ms linear infinite;
-webkit-animation-play-state: running, paused;
animation-play-state: running, paused;
box-shadow: 0 0 80px 0 #00000055 inset;
}
.animDiv:nth-of-type(2) {
-webkit-animation-delay: 100ms, -30ms;
animation-delay: 100ms, -30ms;
}
.animDiv:nth-of-type(3) {
-webkit-animation-delay: 200ms, -60ms;
animation-delay: 200ms, -6.........完整代码请登录后点击上方下载按钮下载查看
网友评论0