TweenMax实现一个飞行的导弹效果代码
代码语言:html
所属分类:动画
代码描述:TweenMax实现一个飞行的导弹效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<html> <head> <style> body { background-color: #061a21; overflow: hidden; } body, html { height: 100%; width: 100%; margin: 0; padding: 0; } .container { position: absolute; max-width: 100%; height: 600px; } svg { max-width: 100%; visibility: hidden; overflow: visible; } #bg { width: 100%; overflow: visible; } .bgSVG { width: 100%; } </style> </head> <body> <svg class="bgSVG" version="1.1" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" xmlns:a="https://ns.adobe.com/AdobeSVGViewerExtensions/3.0/" x="0px" y="0px" width="600px" height="600px" viewBox="0 0 600 600" enable-background="new 0 0 600 600" xml:space="preserve"> <defs> </defs> <linearGradient id="bgGrad" gradientUnits="userSpaceOnUse" x1="300" y1="0" x2="300" y2="600"> <stop offset="0" style="stop-color:#000000" /> <stop offset="1" style="stop-color:#061A21" /> </linearGradient> <rect id="bg" fill="url(#bgGrad)" width="600" height="600" /> </svg> <div class="container"> <!-- Generator: Adobe Illustrator 19.1.0, SVG Export Plug-In --> <svg version="1.1" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" xmlns:a="https://ns.adobe.com/AdobeSVGViewerExtensions/3.0/" x="0px" y="0px" width="600px" height="600px" viewBox="0 0 600 600" enable-background="new 0 0 600 600" xml:space="preserve"> <defs> <filter id="flameShake"> <feTurbulence id="turbulence" baseFrequency="0.3 0.1" type="fractalNoise" stitchTiles="stitch" numOctaves="1" seed="0" /> <feDisplacementMap in="SourceGraphic" scale="23" /> <feGaussianblur stdDeviation="1.5"> </feGaussianblur> <feColorMatrix id="flameHue" type="hueRotate" values="0" /> </filter> <clipPath id="bodyMask"> <rect id="body" x="260" y="125" width="80" height="450" /> </clipPath> <linearGradient id="bodyGrad" gradientUnits="userSpaceOnUse" x1="260" y1="350" x2="340" y2="350"> <stop offset="0" style="stop-color:#000000;stop-opacity:0.7" /> <stop offset="0.081" style=".........完整代码请登录后点击上方下载按钮下载查看
网友评论0