css实现一个雷达动画效果代码
代码语言:html
所属分类:动画
代码描述:css实现一个雷达动画效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<style>
body {
background-color: #000;
margin: 0;
}
.radar {
background: url(https://gtms03.alicdn.com/tps/i3/TB1Vet9IVXXXXbuapXXb2YSIVXX-567-567.png) no-repeat 50% 50%;
width: 284px;
height: 284px;
position: relative;
background-size: 284px 284px;
position: absolute;
left: 50%;
top: 50%;
margin-left: -142px;
margin-top: -142px;
}
.radar:hover {
background: none;
}
.radar .pointer {
position: absolute;
z-index: 1024;
left: 10.5820106%;
right: 10.5820106%;
top: 10.5820106%;
bottom: 50%;
will-change: transform;
transform-origin: 50% 100%;
border-radius: 50% 50% 0 0/100% 100% 0 0;
backgro.........完整代码请登录后点击上方下载按钮下载查看
网友评论0