three+gsap实现三维粒子爱心效果代码
代码语言:html
所属分类:表白
代码描述:three+gsap实现三维粒子爱心效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
body {
margin: 0;
overflow: hidden;
}
.controls {
position: absolute;
top: 0;
left: 0;
z-index: 1;
}
canvas {
position: absolute;
}
svg {
position: absolute;
display: none;
}
</style>
</head>
<body>
<!-- partial:index.partial.html -->
<svg viewBox="0 0 600 552">
<path d="M300,107.77C284.68,55.67,239.76,0,162.31,0,64.83,0,0,82.08,0,171.71c0,.48,0,.95,0,1.43-.52,19.5,0,217.94,299.87,379.69v0l0,0,.05,0,0,0,0,0v0C600,391.08,600.48,192.64,600,173.14c0-.48,0-.95,0-1.43C600,82.08,535.17,0,437.69,0,360.24,0,315.32,55.67,300,107.77" fill="#ee5282"/>
</svg>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/three.133.js"></script>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/OrbitControls.133.js"></script>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/gsap.3.8.0.js"></sc.........完整代码请登录后点击上方下载按钮下载查看
网友评论0