SimplexNoise实现线条波动跳跃交互动画效果
代码语言:html
所属分类:动画
代码描述:SimplexNoise实现线条波动跳跃交互动画效果
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en" >
<head>
<style>
* {
margin: 0;
padding: 0;
}
html,
body {
overflow: hidden;
}
body {
position: relative;
background: #000;
}
p {
padding-bottom: 0.4rem;
}
ul > li {
list-style: none;
padding: 0.4rem 0;
}
.desc {
margin: 1.6rem;
top: 0;
left: 0;
color: #fff;
position: absolute;
padding: 0.8rem;
}
</style>
</head>
<body translate="no" >
<div class="desc">
<p>Simplex Noise.</p>
<ul>
<li>Click : Add line.</li>
<li>Mousemove Y : Noise Amplitude.</li>
<li><button id="reset">Reset</button></li>
</ul>
</div>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/simplex-noise.min.js"></script>
<script>
/*
* File Name / simplexWave.js
* Created Date / Sep 15, 2020
* Aurhor / Toshiya Marukubo
* Twitter / https://twitter.com.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0