gsap+MotionPathPlugin实现彩色圆点路径动画效果代码
代码语言:html
所属分类:动画
代码描述:gsap+MotionPathPlugin实现彩色圆点路径动画效果代码
代码标签: gsap MotionPathPlugin 彩色 圆点 路径 动画
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <style> body { background: #1d1d1d; } .demo { opacity: 0; } .demo svg { overflow: visible; } </style> </head> <body> <div class="demo"> <svg viewBox="0 0 500 300" xmlns="http://www.w3.org/2000/svg"> <defs></defs> <path style="fill: none; stroke-width: 5px; stroke: rgb(144, 141, 141);" d="M 351.8083 69.1945 C 422.1606 69.1945 452.1813 152.7418 426.3861 219.5199 C 405.0252 274.8184 337.3086 293.2454 291.7926 256.1453 C 257.7861 228.4267 237.5661 185.2092 174.1128 219.11 C 112.7792 251.8783 41.8145 190.9837 58.0919 122.3275 C 62.0722 105.5392 70.6161 90.238 82.741 78.1835 C 124.6481 36.5197 192.571 40.5485 229.4636 86.8863 C 257.1423 121.7631 305.7904 70.9843 351.8083 69.1945 Z" class="myPath"></path> </svg> </div> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/gsap.3.9.1.js"></script> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/MotionPathPlugin.min.js"></script> <script > g.........完整代码请登录后点击上方下载按钮下载查看
网友评论0