div+css实现跟随鼠标位置交互三维3d红色钻石代码
代码语言:html
所属分类:三维
代码描述:div+css实现跟随鼠标位置交互三维3d红色钻石代码
代码标签: div css 跟随 鼠标 位置 交互 三维 3d 红色 钻石 代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum=1.0,minimum=1.0,user-scalable=0" />
<style>
body{
background:black;
}
.bg {
background: radial-gradient(circle at center, #1a1a24 0%, #000000 100%);
overflow: hidden;
font-family: sans-serif;
width: 100%;
height: 100%;
}
.tracker {
position: absolute;
width: 20%;
height: 20%;
z-index: 100;
}
.tr-1 {
top: 0;
left: 0;
}
.tr-2 {
top: 0;
left: 20%;
}
.tr-3 {
top: 0;
left: 40%;
}
.tr-4 {
top: 0;
left: 60%;
}
.tr-5 {
top: 0;
left: 80%;
}
.tr-6 {
top: 20%;
left: 0;
}
.tr-7 {
top: 20%;
left: 20%;
}
.tr-8 {
top: 20%;
left: 40%;
}
.tr-9 {
top: 20%;
left: 60%;
}
.tr-10 {
top: 20%;
left: 80%;
}
.tr-11 {
top: 40%;
left: 0;
}
.tr-12 {
top: 40%;
left: 20%;
}
.tr-13 {
top: 40%;
left: 40%;
}
.tr-14 {
top: 40%;
left: 60%;
}
.tr-15 {
top: 40%;
left: 80%;
}
.tr-16 {
top: 60%;
left: 0;
}
.tr-17 {
top: 60%;
left: 20%;
}
.tr-18 {
top: 60%;
left: 40%;
}
.tr-19 {
top: 60%;
left: 60%;
}
.tr-20 {
top: 60%;
left: 80%;
}
.tr-21 {
top: 80%;
left: 0;
}
.tr-22 {
top: 80%;
left: 20%;
}
.tr-23 {
top: 80%;
left: 40%;
}
.tr-.........完整代码请登录后点击上方下载按钮下载查看















网友评论0