网页模板——TweenMax.js+SVG实现的直升机起飞降落动画效果源码.zip资源-CSDN文库

共3个文件

js：2个

html：1个

版权申诉

190 浏览量 2021-11-23 08:58:09 上传评论收藏 70KB ZIP 举报

资源推荐

资源详情

资源评论

收起资源包目录

网页模板——TweenMax.js+SVG 实现的直升机起飞降落动画效果源码.zip （3个子文件）

132687026539367190

index.html 9KB

jquery-1.11.1.min.js 94KB

TweenMax.min.js 101KB

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>TweenMax.js SVG 直升机起飞降落动画</title> <style> body { background: #00ceff; } .ground { position: absolute; width: 100%; height: 10%; bottom: 0; background: #7e4614; z-index: 2; } .runway { position: absolute; width: 100%; bottom: 10%; border-bottom: solid 6px #522e0d; } </style> </head> <body>  <div class="ground"></div> <div class="runway"> <?xml version="1.0" encoding="UTF-8" standalone="no" ?> <svg class="chopper" width="200" height="80" viewBox="0 0 890 518" version="1.1" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" xmlns:sketch="https://www.bohemiancoding.com/sketch/ns"> <title>chopper</title> <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage"> <g id="chopper" sketch:type="MSLayerGroup" transform="translate(445.500000, 259.000000) scale(-1, 1) translate(-445.500000, -259.000000) translate(9.000000, 7.000000)"> <path d="M474.32,6.458 C430.28,9.986 381.084,15.19 329.296,22.002 C145.154,46.22 -2.228,81.659 0.329,101.095 C2.725,119.314 136.032,117.055 304.385,96.751 C305.157,101.876 305.984,106.479 306.846,110.347 C212.38,123.985 142.732,193.9 148.617,270.828 C151.7,311.136 174.109,346.181 208.08,370.645 L145.242,380.243 C129.406,382.663 118.61,397.35 121.029,413.188 C123.447,429.024 138.136,439.819 153.972,437.401 L210.457,428.784 L227.383,436.729 L218.371,438.098 C200.427,440.84 188.199,457.485 190.938,475.43 C193.679,493.375 210.327,505.633 228.271,502.893 L582.574,448.778 C600.517,446.038 612.746,429.393 610.006,411.45 C607.266,393.505 590.619,381.247 572.674,383.985 L501.436,394.874 L477.815,385.464 C487.182,379.507 492.641,368.431 490.85,356.714 C489.942,350.759 487.321,345.515 483.532,341.417 C500.233,322.427 511.786,300.378 516.604,276.801 C569.274,233.646 625.858,200.086 690.624,179.735 C708.895,210.985 743.919,230.825 782.419,227.88 C836.151,223.771 876.423,176.827 872.312,123.095 C868.203,69.362 821.261,29.091 767.527,33.201 C728.211,36.209 696.089,62.157 683.3,96.912 C601.077,99.204 490.487,116.594 418.467,122.3 C402.237,115.999 384.649,111.603 366.181,109.457 C366.377,104.827 365.939,97.426 364.975,88.842 C536.572,64.823 669.945,31.842 667.513,13.346 C665.674,-0.625 586.867,-2.558 474.32,6.458 L474.32,6.458 Z" id="rect4057" stroke="#000000" stroke-width="15" sketch:type="MSShapeGroup"></path> <path d="M145.24,380.243 L457.912,332.489 C473.699,330.079 488.453,340.923 490.863,356.708 L490.863,356.708 C493.273,372.497 482.431,387.249 466.642,389.661 L153.97,437.413 C138.183,439.825 123.43,428.981 121.02,413.192 L121.02,413.192 C118.609,397.407 129.452,382.653 145.24,380.243 L145.24,380.243 Z" id="rect4008" stroke="#000000" stroke-width="4" fill="#FFCC00" sketch:type="MSShapeGroup"></path> <path d="M192.041,391.635 L432.806,367.539 L554.157,415.865 L288.56,465.392 L195.564,421.792 C200.216,412.448 198.297,402.305 192.041,391.635 L192.041,391.635 Z" id="rect4010" stroke="#000000" stroke-width="4" fill="#FF0000" sketch:type="MSShapeGroup"></path> <path d="M775.203,188.683 C803.578,186.513 823.164,162.686 820.98,134.145 C818.796,105.604 795.695,83.447 767.32,85.618 C740.718,87.653 721.256,113.065 723.439,141.607 C725.623,170.146 748.602,190.717 775.203,188.683 L775.203,188.683 Z" id="path3938" stroke="#000000" stroke-width="4" fill="#FF0000" sketch:type="MSShapeGroup"></path> <path d="M414.378,122.653 C539.277,113.343 789.068,65.804 792.195,128.7 C793.334,151.81 773.722,160.223 768.57,162.39 C645.129,179.142 550.896,239.279 463.871,324.159 C429.06,298.35 388.434,160.139 414.378,122.653 L414.378,122.653 Z" id="path3940" stroke="#000000" stroke-width="4" fill="#FF0000" sketch:type="MSShapeGroup"></path> <path d="M345.135,406.502 C447.365,398.68 525.08,325.369 518.744,242.527 C512.543,161.449 424.578,100.809 322.35,108.629 C220.121,116.449 142.404,189.763 148.606,270.841 C154.943,353.68 242.906,414.321 345.135,406.502 L345.135,406.502 Z" id="path3942" stroke="#000000" stroke-width="4" fill="#FF0000" sketch:type="MSShapeGroup"></path> <path d="M302.039,52.922 L355.89,45.84 C357.787,45.59 361.115,58.982 363.32,75.75 L364.375,83.771 C366.581,100.54 366.83,114.335 364.931,114.585 L311.08,121.668 C309.182,121.918 305.855,108.526 303.65,91.757 L302.595,83.736 C300.389,66.969 300.14,53.172 302.039,52.922 L302.039,52.922 Z" id="rect4038" stroke="#000000" stroke-width="4" fill="#FF0000" sketch:type="MSShapeGroup"></path> <path d="M360.734,153.853 C394.952,193.734 380.367,262.348 329.886,306.206 C279.595,352.55 208.981,355.452 174.763,315.573 C137.728,275.906 152.313,207.295 202.603,160.949 C253.084,117.089 323.509,111.702 360.734,153.853 L360.734,153.853 Z" id="path3944" stroke="#000000" stroke-width="4" fill="#99FFFF" sketch:type="MSShapeGroup"></path> <path d="M218.381,438.108 L572.677,383.999 C590.566,381.267 607.282,393.554 610.015,411.442 L610.015,411.442 C612.745,429.333 600.46,446.047 582.572,448.778 L228.275,502.887 C210.385,505.621 193.67,493.334 190.937,475.444 L190.937,475.444 C188.206,457.557 200.493,440.84 218.381,438.108 L218.381,438.108 Z" id="rect4006" stroke="#000000" stroke-width="4" fill="#FFCC00" sketch:type="MSShapeGroup"></path> <path d="M268.655,148.786 C290.806,153.036 294.621,177.363 277.843,202.448 C261.538,228.247 229.018,245.491 206.866,241.241 C183.432,237.709 179.618,213.382 195.922,187.582 C212.701,162.498 244.748,144.54 268.655,148.786 L268.655,148.786 Z" id="path4013" fill="#FFFFFF" sketch:type="MSShapeGroup"></path> <path d="M872.311,123.095 C876.442,176.854 836.213,223.784 782.454,227.918 C728.694,232.05 681.765,191.819 677.632,138.06 C677.63,138.036 677.628,138.011 677.628,137.987 C673.495,84.228 713.724,37.298 767.483,33.165 C821.243,29.033 868.172,69.262 872.303,123.022 C872.307,123.046 872.309,123.071 872.311,123.095 L872.311,123.095 Z" id="path4019" stroke="#000000" stroke-width="17.3452" fill-opacity="0.8824" fill="#CCCCCC" sketch:type="MSShapeGroup"></path> <path d="M797.939,128.784 C798.914,141.47 789.421,152.546 776.734,153.521 C764.047,154.496 752.972,145.002 751.998,132.315 C751.996,132.309 751.996,132.304 751.996,132.298 C751.019,119.611 760.514,108.536 773.201,107.561 C785.887,106.585 796.963,116.08 797.939,128.767 C797.939,128.772 797.939,128.778 797.939,128.784 L797.939,128.784 Z" id="path4021" stroke="#000000" stroke-width="73.4992" fill="#FF0000" sketch:type="MSShapeGroup"></path> <path d="M667.514,13.348 C670.141,32.784 522.918,68.19 338.684,92.429 C154.451,116.668 2.969,120.561 0.342,101.124 C0.341,101.115 0.34,101.106 0.338,101.098 C-2.288,81.661 144.933,46.255 329.168,22.016 C513.402,-2.223 664.883,-6.115 667.51,13.322 C667.512,13.33 667.512,13.339 667.514,13.348 L667.514,13.348 Z" id="path4023" stroke="#000000" stroke-width="15.4912" fill-opacity="0.8824" fill="#CCCCCC" sketch:type="MSShapeGroup"></path> <path d="M330.861,40.555 C302.264,44.317 276.982,55.08 257.986,69.969 L408.863,50.125 C386.664,40.653 359.458,36.793 330.861,40.555 L330.861,40.555 Z" id="path4030" stroke="#000000" stroke-width="4" fill="#FF0000" sketch:type="MSShapeGroup"></path> </g> </g> </svg> </div> <script

评论收藏

内容反馈

版权申诉