gsap实现行走的方块动画效果
代码语言:html
所属分类:动画
代码描述:gsap实现行走的方块动画效果
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <style> .wrapper { display: flex; width: 100vw; height: 100vh; align-items: center; justify-content: center; } </style> </head> <body translate="no"> <div class="wrapper"> <svg width="200" height="150" viewBox="0 0 200 150"> <path id="path" d="M46 50C46 50 52 50 146 50C146 81.5 146 150 146 150C62.4999 150 46 150 46 150C46 150 46 93.5 46 50Z" fill="blue" /> </svg> </div> <script type="text/javascript" src="http://repo.bfw.wiki/bfwrepo/js/gsap.3.3.1.js"></script> <script > const path = document.getElementById(`path`); const tl = gsap.timeline({ repeat: -1 }). pause(); tl.to(.........完整代码请登录后点击上方下载按钮下载查看
网友评论0