js实现假的三维云朵鼠标交互效果代码
代码语言:html
所属分类:其他
代码描述:js实现假的三维云朵鼠标交互效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<style>
#viewport {
position: absolute;
overflow: hidden;
top: 0;
right: 0;
bottom: 0;
left: 0;
perspective: 1000px;
background-image: linear-gradient(bottom, #4584b4 28%, #1f4778 64%);
background-image: -o-linear-gradient(bottom, #4584b4 28%, #1f4778 64%);
background-image: -moz-linear-gradient(bottom, #4584b4 28%, #1f4778 64%);
background-image: -webkit-linear-gradient(bottom, #4584b4 28%, #1f4778 64%);
background-image: -ms-linear-gradient(bottom, #4584b4 28%, #1f4778 64%);
background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0.28, #4584b4), color-stop(0.64, #1f4778));
}
#world {
position: absolute;
height: 512px;
width: 512px;
top: 50%;
left: 50%;
margin-left: -256px;
margin-top: -256px;
transform-style: preserve-3d;
}
#world div {
transform-style: preserve-3d;
}
.cloudBase {
position: absolute;
height: 20px;
width: 20px;
top: 256px;
left: 256px;
margin-top: -10px;
margin-left: -10px;
}
..........完整代码请登录后点击上方下载按钮下载查看
















网友评论0