css实现音频语音通话麦克风频谱loading加载动画效果代码

代码语言:html

所属分类:动画

代码描述:css实现音频语音通话麦克风频谱loading加载动画效果代码

代码标签: css 音频 麦克风 语音

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<html>

<head>
    <style>
        * {
        	margin:0px;
        	padding:0px;
        	border:0px;
        }
        html,body {
        	min-height:100%;
        }
        body {
        	background:#f8f8f8;
        }
        .loader {
        	position:absolute;
        	top:0px;
        	bottom:0px;
        	left:0px;
        	right:0px;
        	margin:auto;
        	width:175px;
        	height:100px;
        }
        .loader span {
        	display:block;
        	background:#fcb34f;
        	width:7px;
        	height:10%;
        	border-radius:14px;
        	margin-right:5px;
        	float:left;
        	margin-top:25%;
        }
        .loader span:last-child {
        	margin-right:0px;
        }
        .loader span:nth-child(1) {
        	animation:load 2.5s 1.4s infinite linear;
        }
        .loader span:nth-child(2) {
        	animation:load 2.5s 1.2s infinite linear;
        }
        .loader span:nth-child(3) {
        	animation:load 2.5s 1s infinite linear;
        }
        .loader span:nth-child(4) {
        	animation:load 2.5s 0.8s infinite linear;
        }
        .loader span:nth-child(5) {
        	animation:load 2.5s 0.6s infinite linear;
        }
        .loader span:nth-child(6) {
        	animation:load 2.5s 0.4s infinite linear;
        }
        .loader span:nth-child(7) {
        	animation:load 2.5s 0.2s infinite linear;
        }
        .loader span:nth-child(8) {
        	animation:load 2.5s 0s infinite linear;
        }
        .loader span:nth-child(9) {
        	animation:load 2.5s 0.2s inf.........完整代码请登录后点击上方下载按钮下载查看

网友评论0