gsap实现UFO飞碟动画
代码语言:html
所属分类:动画
代码描述:gsap实现幻灯片效果
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <style> #cow{ width: 300px; height: auto; position: absolute; top: 600px; left: 250px; } body { background-image: linear-gradient(rgb(9, 28, 87), rgba(9, 28, 7, 0.9)); } </style> </head> <body translate="no"> <img id="cow" src="https://i.imgur.com/d6I3VOC.png"> <svg width="872" height="1040" viewBox="0 0 872 1040" fill="none" xmlns="http://www.w3.org/2000/svg"> <path class="ufo" d="M419.5 108C412.18 114.223 404.5 127.5 404.5 127.5L660.5 162.5C660.5 162.5 657.325 151.576 653.5 145.5C646.481 134.35 638.667 130.992 627.5 124C613.853 115.454 604.733 113.218 589.5 108C574.579 102.888 552.5 97.4999 550.5 97.4999C548.5 97.5 517.5 93.9999 503 93.9999C488.5 93.9999 470.5 92.4999 459 93.9999C447.5 95.5 431.969 97.3996 419.5 108Z" fill="url(#paint0_linear)" stroke="#373D40" stroke-width="2" /> <g filter="url(#filter0_i)"> <ellipse class="ufo" cx="522.17" cy="225.112" rx="221.168" ry="110.621" transform="rotate(8.72449 522.17 225.112)" fill="url(#paint1_linear)" /> </g> <path class="ufo" d="M739.297 258.432C734.796 287.761 706.853 311.06 664.426 324.721C622.094 338.352 565.805 342.206 505.618 332.97C445.432 323.734 392.889 303.178 356.592 277.481C320.214 251.727 300.543 221.121 305.044 191.792C309.545 162.462 337.488 139.163 379.915 125.502C422..........完整代码请登录后点击上方下载按钮下载查看
网友评论0