TweenLite+Physics2DPlugin实现弹射碎纸屑粒子重力下落效果代码
代码语言:html
所属分类:粒子
代码描述:TweenLite+Physics2DPlugin实现弹射碎纸屑粒子重力下落效果代码
代码标签: TweenLite 纸屑 弹射 粒子 重力 动画
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <style> body { cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; overflow: hidden; } #canvas { background: linear-gradient(#9FF781, #F3F781); } .copy { position: absolute; top: 45%; left: 0; width: 100%; text-align: center; pointer-events: none; font-family: "Futura", "Helvetica Neue", Helvetica; color: #333; } .copy h1 { margin: 0; color: white; letter-spacing: 1px; font-size: 7vmin; font-weight: 700; } .copy p { margin: 0; } </style> </head> <body> <canvas id="canvas"></canvas> <div class="copy"> <h1>Confetti Cannon</h1> <p>click, drag & release</p> </div> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/TweenLite.js"></script> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/Physics2DPlugin.js"></script> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/lodash-min.js"></script> <script> // utilities function getLength(x0, y0, x1, y1) { // returns the length of a line segment const x = x1 - x0; const y = y1 - y0; return Math.sqrt(x * x + y * y); } function getDegAngle(x0, y0, x1, y1) { const y = y1 - y0; .........完整代码请登录后点击上方下载按钮下载查看
网友评论0