Plane, Goodbye

Developer
Size
9,358 Kb
Views
16,192

How do I make an plane, goodbye?

A quick pen for a Dev that left work.. What is a plane, goodbye? How do you make a plane, goodbye? This script and codes were developed by B. on 21 December 2022, Wednesday.

Plane, Goodbye Previews

Plane, Goodbye - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Plane, Goodbye</title> <script src="https://s.codepen.io/assets/libs/modernizr.js" type="text/javascript"></script> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css"> <link rel="stylesheet" href="css/style.css">
</head>
<body> <div class="stage"> <svg class="clouds"> </svg> <div class="plane"> <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="89.87px" height="34.306px" viewBox="0 0 89.87 34.306" enable-background="new 0 0 89.87 34.306" xml:space="preserve">
<g>	<g>	<path fill="#939498" d="M86,16.004c0,0,1.348-0.071,1.95-0.199c1.252-0.267,1.92-0.774,1.92-1.356c0-0.578-0.576-1.084-1.83-1.352	C87.44,12.971,86,12.9,86,12.9V16.004z"/>	</g>	<g>	<path fill="#750F05" d="M83.832,19.73c1.302-0.857,1.95-2.047,1.95-5.282c0-3.232-0.646-4.23-1.943-5.088L83.832,19.73z"/>	</g>	<g>	<path fill="#270502" d="M85.782,14.448c0-3.232-0.646-4.23-1.943-5.088"/>	</g>	<g>	<path fill="#9C1407" d="M47.988,9.195l0.554,1.111c0.556,1.199,2.405,1.903,3.813,1.903c1.766,0,4.645-1.409,4.645-3.101V9.086	c0,0,21.688-0.374,23.025,0.968c0.871,0.864,1.975,1.16,1.975,1.16v9.771c0-1.248-2.666-0.865-2.666-0.865	s-4.311,3.253-8.758,3.253l-2.303,1.539c0,0,2.244,0-17.381,0c-13.798-1-31.657-3.535-41.869-4.902l-0.036-0.367	c-0.037,0.429-0.399,0.59-0.839,0.59c-0.472,0-0.853-0.47-0.853-0.937c0-0.057,0.007-0.154,0.016-0.205l-0.041-0.023	c-3.356-0.487-4.948-0.933-5.556-1.288C0.842,17.778,0,17.618,0,14.703c0-2.918,0-2.604,0-11.669	c0-9.071,18.148,4.387,18.148,11.763"/>	<path fill="#57130D" d="M0.847,4.422c0-9.068,15.989,2.898,15.989,10.274c0,0,0.681-1.885-6.37-8.938	C4.639-0.067,0.847,4.422,0.847,4.422z"/>	</g>	<g>	<path fill="#57130D" d="M18.227,15.241l29.762-5.596l0.554,1.107c0.556,1.2,2.405,1.907,3.813,1.907	c1.766,0,4.645-1.413,4.645-3.103V9.535c0,0,21.393-0.373,22.732,0.966c0.865,0.863,1.825,1.189,1.825,1.189"/>	<path fill="#57130D" d="M18.227,15.241"/>	</g>	<g>	<rect x="16.319" y="20.224" fill="#999999" width="0" height="1.929"/>	</g>	<g>	<rect x="14.776" y="21.235" transform="matrix(-0.7083 -0.7059 0.7059 -0.7083 10.3762 48.4227)" fill="#999999" width="0.836" height="1.666"/>	</g>	<g>	<path fill="#1A1A1A" d="M64.646,31.387c0,1.616,1.308,2.919,2.919,2.919c1.612,0,2.918-1.303,2.918-2.919	c0-1.609-1.306-2.915-2.918-2.915C65.953,28.472,64.646,29.777,64.646,31.387z"/>	</g>	<g>	<path fill="#8F8F8F" d="M61.021,30.347c0,0-1.3,1.424,6.544,1.424c2.182,0,4.67,0.646,4.67-0.752c0-2.623-2.128-5.424-4.75-5.424	S62.527,27.302,61.021,30.347z"/>	</g>	<g>	<polygon fill="#737373" points="62.227,28.423 62.813,27.834 57.668,22.681 57.079,23.273	"/>	</g>	<g>	<path fill="#737373" d="M69.938,25.611c2.361,0,3.062,1.041,3.062,1.041s0-2.168,0-4.447C73,19.931,70.066,25.565,69.938,25.611z"	/>	</g>	<g>	<path fill="#270502" d="M69.302,21.238c0.044,0,0.084-0.014,0.116-0.042c0.062-0.06,0.054-0.146-0.007-0.2L51.004,5.797	c-0.065-0.052-0.159-0.05-0.226,0.006c-0.054,0.052-0.05,0.141,0.01,0.195L69.194,21.2C69.224,21.226,69.266,21.238,69.302,21.238	z"/>	</g>	<g>	<path fill="#270502" d="M68.09,4.513c0.042-0.006,0.088,0.004,0.122,0.024c0.063,0.05,0.071,0.136,0.02,0.197L52.211,22.432	c-0.059,0.06-0.155,0.07-0.222,0.026c-0.064-0.051-0.077-0.135-0.019-0.196L67.989,4.563C68.018,4.535,68.052,4.519,68.09,4.513z"	/>	</g>	<g>	<polygon fill="#270502" points="4,18.921 4,18.921 5.895,9.433 12.183,6.073 11.112,5.845 4,9.29	"/>	</g>	<g>	<path fill="#333333" d="M85.776,14.981C85.776,3.169,88,0.253,88,0.253v14.729v14.59C88,29.571,85.776,26.789,85.776,14.981z"/>	</g>	<g>	<path fill="#1A1A1A" d="M13.289,22.646c0,0.768,0.622,1.392,1.393,1.392c0.765,0,1.383-0.624,1.383-1.392	c0-0.767-0.618-1.39-1.383-1.39C13.911,21.256,13.289,21.879,13.289,22.646z"/>	</g>	<g>	<circle fill="#737373" cx="14.681" cy="22.646" r="0.417"/>	</g>	<g>	<path fill="#57130D" d="M0,15.188c0,0,3.614,0.771,8.073,0.771c4.457,0,8.066-0.348,8.066-0.771c0-0.428-3.609-0.771-8.066-0.771	C3.614,14.417,0,15.188,0,15.188z"/>	</g>	<g>	<path fill="#270502" d="M0,15.188c0,0,3.614,0.771,8.073,0.771c4.457,0,8.066-0.348,8.066-0.771"/>	</g>	<g>	<path fill="#270502" d="M48.148,5.531c0,0,4.75,1.427,10.548,1.242c5.801-0.181,10.48-1.032,10.452-1.897	c-0.026-0.875-4.751-1.43-10.55-1.248C52.799,3.813,48.148,5.531,48.148,5.531z"/>	</g>	<g>	<path fill="#57130D" d="M69.148,4.876c-0.026-0.875-4.751-1.43-10.55-1.248c-5.8,0.186-10.45,1.903-10.45,1.903"/>	</g>	<g>	<path fill="#270502" d="M50.405,22.744c0,0,4.814,1.18,10.596,0.702c5.783-0.48,10.414-1.572,10.34-2.438	c-0.072-0.867-4.817-1.179-10.6-0.701C54.958,20.783,50.405,22.744,50.405,22.744z"/>	</g>	<g>	<path fill="#57130D" d="M71.341,21.008c-0.072-0.867-4.817-1.179-10.6-0.701c-5.783,0.477-10.336,2.438-10.336,2.438"/>	</g>	<g>	<rect x="82" y="6.911" fill="#9C1407" width="4" height="15"/>	</g>	<g>	<polyline fill="#57130D" points="86,7.911 86,6.911 82,6.911	"/>	</g>
</g>
</svg> <div class="banner">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="194.308px" height="30px" viewBox="0 0 194.308 30" enable-background="new 0 0 194.308 30" xml:space="preserve">
<g>	<polygon fill="#E6C77D" stroke="#D34830" stroke-miterlimit="10" points="171.087,29.404 1.087,29.404 13.087,15.404 1.087,0.404	171.087,0.404	"/>	<g>	<line fill="none" stroke="#270502" stroke-miterlimit="10" x1="186.524" y1="15.138" x2="193.954" y2="7.708"/>	<line fill="none" stroke="#270502" stroke-miterlimit="10" x1="186.524" y1="14.671" x2="193.954" y2="22.101"/>	</g>	<line fill="none" stroke="#270502" stroke-miterlimit="10" x1="187.087" y1="14.5" x2="171.087" y2="14.5"/>	<g>	<path d="M28.775,18.646v-8h3.562c1.392,0,2.243,0.84,2.243,2.039c0,1.008-0.672,1.68-1.403,1.834	c0.852,0.133,1.56,1.008,1.56,1.967c0,1.283-0.852,2.16-2.315,2.16H28.775z M33.549,12.829c0-0.721-0.479-1.297-1.379-1.297	h-2.399v2.58h2.399C33.069,14.112,33.549,13.56,33.549,12.829z M33.705,16.378c0-0.73-0.504-1.379-1.476-1.379h-2.459v2.758h2.459	C33.153,17.757,33.705,17.229,33.705,16.378z"/>	<path d="M36.107,20.097c0.132,0.059,0.348,0.096,0.491,0.096c0.396,0,0.66-0.133,0.864-0.611l0.384-0.877l-2.423-5.852h0.983	l1.919,4.75l1.931-4.75h0.972l-2.902,6.969c-0.348,0.838-0.936,1.162-1.703,1.174c-0.192,0-0.492-0.035-0.647-0.084L36.107,20.097	z"/>	<path d="M41.831,15.743c0-1.68,1.199-3.035,2.854-3.035c1.751,0,2.782,1.367,2.782,3.107v0.227h-4.677	c0.071,1.092,0.827,2.004,2.074,2.004c0.672,0,1.332-0.264,1.8-0.744l0.432,0.588c-0.588,0.576-1.367,0.898-2.303,0.898	C43.066,18.788,41.831,17.554,41.831,15.743z M44.674,13.452c-1.235,0-1.847,1.043-1.896,1.918h3.803	C46.568,14.519,45.993,13.452,44.674,13.452z"/>	<path d="M51.936,18.646v-8h0.995v7.111h3.718v0.889H51.936z"/>	<path d="M57.359,15.743c0-1.68,1.199-3.035,2.854-3.035c1.751,0,2.782,1.367,2.782,3.107v0.227h-4.677	c0.071,1.092,0.827,2.004,2.074,2.004c0.672,0,1.332-0.264,1.8-0.744l0.432,0.588c-0.588,0.576-1.367,0.898-2.303,0.898	C58.595,18.788,57.359,17.554,57.359,15.743z M60.202,13.452c-1.235,0-1.847,1.043-1.896,1.918h3.803	C62.097,14.519,61.521,13.452,60.202,13.452z"/>	<path d="M69.465,18.646l-1.512-4.654l-1.511,4.654h-0.899l-1.848-5.793h0.936l1.415,4.617l1.523-4.617h0.779l1.512,4.617	l1.415-4.617h0.947l-1.847,5.793H69.465z"/>	<path d="M73.103,11.425c0-0.336,0.276-0.611,0.612-0.611s0.6,0.275,0.6,0.611s-0.264,0.6-0.6,0.6S73.103,11.761,73.103,11.425z M73.259,18.646v-5.793h0.899v5.793H73.259z"/>	<path d="M75.468,17.878l0.455-0.648c0.384,0.443,1.115,0.828,1.907,0.828c0.888,0,1.379-0.42,1.379-0.996	c0-1.402-3.586-0.539-3.586-2.686c0-0.912,0.768-1.668,2.147-1.668c0.995,0,1.69,0.371,2.146,0.84l-0.42,0.623	c-0.348-0.42-0.972-0.73-1.727-0.73c-0.792,0-1.284,0.395-1.284,0.91c0,1.26,3.587,0.432,3.587,2.688	c0,0.971-0.78,1.75-2.268,1.75C76.847,18.788,76.055,18.489,75.468,17.878z"/>	<path d="M81.778,20.169l-0.456-0.373c0.384-0.252,0.731-0.719,0.779-1.115c-0.023,0.012-0.107,0.023-0.168,0.023	c-0.323,0-0.575-0.264-0.575-0.611s0.275-0.646,0.636-0.646c0.407,0,0.755,0.336,0.755,0.91	C82.749,19.089,82.33,19.772,81.778,20.169z"/>	<path d="M89.421,18.646v-7.113h-2.53v-0.887h6.068v0.887h-2.542v7.113H89.421z"/>	<path d="M98.168,18.646v-3.814c0-1.031-0.516-1.318-1.308-1.318c-0.695,0-1.367,0.432-1.703,0.898v4.234h-0.899v-8h0.899v3.047	c0.396-0.492,1.188-0.984,2.063-0.984c1.211,0,1.847,0.588,1.847,1.848v4.09H98.168z"/>	<path d="M104.492,18.646v-0.66c-0.468,0.527-1.14,0.803-1.919,0.803c-0.972,0-2.015-0.658-2.015-1.918	c0-1.307,1.031-1.906,2.015-1.906c0.792,0,1.451,0.252,1.919,0.779v-1.045c0-0.768-0.624-1.211-1.463-1.211	c-0.696,0-1.26,0.24-1.775,0.805l-0.42-0.625c0.624-0.646,1.367-0.959,2.315-0.959c1.234,0,2.242,0.553,2.242,1.955v3.982H104.492	z M104.492,17.421v-1.104c-0.348-0.467-0.959-0.707-1.583-0.707c-0.852,0-1.439,0.527-1.439,1.26c0,0.744,0.588,1.271,1.439,1.271	C103.533,18.142,104.145,17.901,104.492,17.421z"/>	<path d="M111.128,18.646v-3.791c0-1.031-0.527-1.342-1.308-1.342c-0.707,0-1.367,0.432-1.715,0.898v4.234h-0.899v-5.793h0.899	v0.84c0.408-0.492,1.199-0.984,2.075-0.984c1.199,0,1.835,0.611,1.835,1.871v4.066H111.128z"/>	<path d="M117.776,18.646l-2.075-2.604l-0.972,0.947v1.656h-0.899v-8h0.899v5.289l3.047-3.082h1.139l-2.566,2.627l2.579,3.166	H117.776z"/>	<path d="M122.926,20.097c0.132,0.059,0.348,0.096,0.491,0.096c0.396,0,0.66-0.133,0.864-0.611l0.384-0.877l-2.423-5.852h0.983	l1.919,4.75l1.931-4.75h0.972l-2.902,6.969c-0.348,0.838-0.936,1.162-1.703,1.174c-0.192,0-0.492-0.035-0.647-0.084	L122.926,20.097z"/>	<path d="M128.649,15.743c0-1.68,1.104-3.035,2.866-3.035c1.764,0,2.867,1.355,2.867,3.035c0,1.678-1.104,3.045-2.867,3.045	C129.753,18.788,128.649,17.421,128.649,15.743z M133.435,15.743c0-1.176-0.684-2.23-1.919-2.23s-1.919,1.055-1.919,2.23	c0,1.188,0.684,2.242,1.919,2.242S133.435,16.931,133.435,15.743z"/>	<path d="M139.76,18.646v-0.816c-0.444,0.504-1.199,0.959-2.063,0.959c-1.211,0-1.847-0.6-1.847-1.846v-4.09h0.899v3.814	c0,1.018,0.516,1.318,1.308,1.318c0.695,0,1.367-0.408,1.703-0.875v-4.258h0.899v5.793H139.76z"/>	<path d="M142.281,18.104c0-0.359,0.3-0.658,0.659-0.658c0.36,0,0.66,0.299,0.66,0.658c0,0.361-0.3,0.66-0.66,0.66	C142.581,18.765,142.281,18.466,142.281,18.104z"/>	</g>
</g>
</svg> </div> </div> <div class="landscape"> <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="830.574px" height="421.911px" viewBox="0 0 830.574 421.911" enable-background="new 0 0 830.574 421.911" xml:space="preserve"> <g> <g> <defs> <path id="SVGID_1_" d="M481.14,366.753L318.063,252.024l-53.294-4.687l-57.142-35.142L121.5,41.006l-14.597-17.902L71,67.006 L-1,171.542c0,0-37.745,6.175-40,8.988c-2.255,2.813-43.386,53.251-45.725,57.019s-184.804,115.21-184.804,115.21"/> </defs> <use xlink:href="#SVGID_1_" overflow="visible" fill="#4D4D4D"/> <clipPath id="SVGID_2_"> <use xlink:href="#SVGID_1_" overflow="visible"/> </clipPath> <polygon clip-path="url(#SVGID_2_)" fill="#FFFFFF" points="139,50.006 146.5,88.006 104.806,71.006 61,82.006 71,50.006 71,17.911 139,17.911	"/> <polyline clip-path="url(#SVGID_2_)" fill="#D7D8D6" points="105,17.911 139,17.911 139,50.006 146.5,88.006 104.903,70.958	"/> </g> <g> <defs> <path id="SVGID_3_" d="M602.14,399.753L439.063,285.024l-53.294-4.687l-57.142-35.142L242.5,74.006l-14.598-17.902L192,100.006 l-44.627,61.774c0,0-65.118,48.937-67.373,51.75c-2.255,2.813-43.386,53.251-45.725,57.019s-184.804,115.21-184.804,115.21"/> </defs> <use xlink:href="#SVGID_3_" overflow="visible" fill="#808080"/> <clipPath id="SVGID_4_"> <use xlink:href="#SVGID_3_" overflow="visible"/> </clipPath> <polygon clip-path="url(#SVGID_4_)" fill="#FFFFFF" points="260,83.006 246.5,93.006 225.806,88.006 202,97.006 192,83.006 192,50.911 260,50.911	"/> <polyline clip-path="url(#SVGID_4_)" fill="#D7D8D6" points="226,50.911 260,50.911 260,83.006 246.5,93.006 225.902,87.958	"/> </g> <g> <polygon fill="#3A6D5C" points="-83.21,426.06 201.436,292.06 375.51,274.495 489.79,283.583 544.79,273.747 610.389,277.126 724.668,342.231 855.778,441.075	"/> <g> <g> <rect x="201" y="302.911" fill="#504135" width="2" height="6"/> <polygon fill="#1E2A14" points="212.102,304.911 208.117,297.911 209.869,297.911 206.237,291.911 208.237,291.911 201.558,280.342 194.879,291.911 196.879,291.911 193.247,297.911 194.998,297.911 191.015,304.911	"/> </g> <g> <rect x="217" y="299.911" fill="#504135" width="2" height="6"/> <polygon fill="#1E2A14" points="228.102,301.911 224.117,294.911 225.869,294.911 222.237,288.911 224.237,288.911 217.558,277.342 210.879,288.911 212.879,288.911 209.247,294.911 210.998,294.911 207.015,301.911	"/> </g> <g> <rect x="179" y="304.911" fill="#504135" width="2" height="6"/> <polygon fill="#1E2A14" points="190.868,306.911 186.885,299.911 188.637,299.911 185.005,293.911 187.005,293.911 180.325,282.342 173.646,293.911 175.646,293.911 172.014,299.911 173.766,299.911 169.782,306.911	"/> </g> <g> <rect x="159" y="310.911" fill="#504135" width="2" height="6"/> <polygon fill="#1E2A14" points="170.868,312.911 166.885,305.911 168.637,305.911 165.005,299.911 167.005,299.911 160.325,288.342 153.646,299.911 155.646,299.911 152.014,305.911 153.766,305.911 149.782,312.911	"/> </g> <g> <rect x="238" y="294.911" fill="#504135" width="2" height="6"/> <polygon fill="#1E2A14" points="249.652,296.911 245.669,289.911 247.42,289.911 243.789,283.911 245.789,283.911 239.109,272.342 232.43,283.911 234.43,283.911 230.798,289.911 232.549,289.911 228.566,296.911	"/> </g> <g> <rect x="229" y="301.911" fill="#504135" width="2" height="6"/> <polygon fill="#2D3E1D" points="240.985,303.911 237.002,296.911 238.753,296.911 235.121,290.911 237.121,290.911 230.442,279.342 223.763,290.911 225.763,290.911 222.131,296.911 223.883,296.911 219.898,303.911	"/> </g> <g> <rect x="253" y="294.911" fill="#504135" width="2" height="6"/> <polygon fill="#2D3E1D" points="264.218,296.911 260.234,289.911 261.986,289.911 258.354,283.911 260.354,283.911 253.675,272.342 246.995,283.911 248.995,283.911 245.363,289.911 247.115,289.911 243.132,296.911	"/> </g> <g> <rect x="190" y="308.911" fill="#504135" width="2" height="6"/> <polygon fill="#2D3E1D" points="201.55,310.911 197.566,303.911 199.318,303.911 195.686,297.911 197.687,297.911 191.007,286.342 184.327,297.911 186.327,297.911 182.695,303.911 184.447,303.911 180.464,310.911	"/> </g> <g> <rect x="245" y="297.911" fill="#504135" width="2" height="6"/> <polygon fill="#3C5327" points="256.536,299.911 252.553,292.911 254.305,292.911 250.673,286.911 252.673,286.911 245.993,275.342 239.313,286.911 241.314,286.911 237.682,292.911 239.434,292.911 235.45,299.911	"/> </g> <g> <rect x="211" y="305.911" fill="#504135" width="2" height="6"/> <polygon fill="#3C5327" points="222.434,307.911 218.451,300.911 220.202,300.911 216.57,294.911 218.57,294.911 211.891,283.342 205.211,294.911 207.211,294.911 203.58,300.911 205.331,300.911 201.348,307.911	"/> </g> <g> <rect x="145" y="314.911" fill="#504135" width="2" height="6"/> <polygon fill="#1E2A14" points="156.102,316.911 152.117,309.911 153.869,309.911 150.237,303.911 152.237,303.911 145.558,292.342 138.879,303.911 140.879,303.911 137.247,309.911 138.998,309.911 135.015,316.911	"/> </g> <g> <rect x="151" y="316.911" fill="#504135" width="2" height="6"/> <polygon fill="#2D3E1D" points="162.985,318.911 159.002,311.911 160.753,311.911 157.121,305.911 159.121,305.911 152.442,294.342 145.763,305.911 147.763,305.911 144.131,311.911 145.883,311.911 141.898,318.911	"/> </g> <g> <rect x="169" y="309.911" fill="#504135" width="2" height="6"/> <polygon fill="#2D3E1D" points="180.218,311.911 176.234,304.911 177.986,304.911 174.354,298.911 176.354,298.911 169.675,287.342 162.995,298.911 164.995,298.911 161.363,304.911 163.115,304.911 159.132,311.911	"/> </g> <g> <rect x="126" y="318.911" fill="#504135" width="2" height="6"/> <polygon fill="#1E2A14" points="137.868,320.911 133.885,313.911 135.637,313.911 132.005,307.911 134.005,307.911 127.325,296.342 120.646,307.911 122.646,307.911 119.014,313.911 120.766,313.911 116.782,320.911	"/> </g> <g> <rect x="108" y="331.911" fill="#504135" width="2" height="6"/> <polygon fill="#1E2A14" points="119.868,333.911 115.885,326.911 117.637,326.911 114.005,320.911 116.005,320.911 109.325,309.342 102.646,320.911 104.646,320.911 101.014,326.911 102.766,326.911 98.782,333.911	"/> </g> <g> <rect x="134" y="326.911" fill="#504135" width="2" height="6"/> <polygon fill="#2D3E1D" points="145.55,328.911 141.566,321.911 143.318,321.911 139.686,315.911 141.687,315.911 135.007,304.342 128.327,315.911 130.327,315.911 126.696,321.911 128.447,321.911 124.464,328.911	"/> </g> <g> <rect x="120" y="330.911" fill="#504135" width="2" height="6"/> <polygon fill="#2D3E1D" points="131.218,332.911 127.234,325.911 128.986,325.911 125.354,319.911 127.354,319.911 120.675,308.342 113.995,319.911 115.995,319.911 112.363,325.911 114.115,325.911 110.132,332.911	"/> </g> <g> <rect x="107" y="340.911" fill="#504135" width="2" height="6"/> <polygon fill="#3C5327" points="118.536,342.911 114.553,335.911 116.305,335.911 112.673,329.911 114.673,329.911 107.993,318.342 101.313,329.911 103.314,329.911 99.682,335.911 101.434,335.911 97.45,342.911	"/> </g> <g> <rect x="145" y="325.911" fill="#504135" width="2" height="6"/> <polygon fill="#3C5327" points="156.434,327.911 152.451,320.911 154.202,320.911 150.57,314.911 152.57,314.911 145.891,303.342 139.211,314.911 141.211,314.911 137.58,320.911 139.331,320.911 135.348,327.911	"/> </g> </g> <g> <g> <rect x="611" y="279.911" fill="#504135" width="3" height="9"/> <polygon fill="#1E2A14" points="627.721,282.911 621.822,271.911 624.415,271.911 619.038,262.911 622,262.911 612.109,245.782 602.221,262.911 605.182,262.911 599.805,271.911 602.397,271.911 596.5,282.911	"/> </g> <g> <rect x="619" y="284.911" fill="#504135" width="3" height="9"/> <polygon fill="#2D3E1D" points="636.132,287.911 630.235,276.911 632.827,276.911 627.451,267.911 630.412,267.911 620.522,250.782 610.632,267.911 613.594,267.911 608.217,276.911 610.809,276.911 604.912,287.911	"/> </g> <g> <rect x="626" y="289.911" fill="#504135" width="3" height="9"/> <polygon fill="#3C5327" points="642.844,292.911 636.947,281.911 639.54,281.911 634.163,272.911 637.124,272.911 627.234,255.782 617.344,272.911 620.306,272.911 614.929,281.911 617.521,281.911 611.625,292.911	"/> </g> </g> </g> </g> </svg> </div>
</div> <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script> <script src="js/index.js"></script>
</body>
</html>

Plane, Goodbye - Script Codes CSS Codes

.stage { background-color: #3d7d84; overflow: hidden; width: 100%; height: 100vh;
}
.plane { position: relative; left: -100%; top: 42vh; -webkit-animation-name: plane-fly; animation-name: plane-fly; -webkit-animation-duration: 15s; animation-duration: 15s; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-timing-function: linear; animation-timing-function: linear;
}
@-webkit-keyframes plane-fly { 0% { left: -10%; -webkit-transform: scale(1.4); transform: scale(1.4); } 50% { left: 110%; -webkit-transform: scale(1); transform: scale(1); } 51% { -webkit-transform: rotateY(180deg); transform: rotateY(180deg); -webkit-animation-duration: 30s; animation-duration: 30s; } 100% { left: -110%; -webkit-transform: scale(0.4) rotateY(180deg); transform: scale(0.4) rotateY(180deg); -webkit-animation-duration: 30s; animation-duration: 30s; }
}
.banner { position: absolute; left: -12.1em; top: -0.35em;
}
.landscape { position: absolute; bottom: -4px;
}
.clouds { height: 50vh; width: 100%; position: absolute;
}

Plane, Goodbye - Script Codes JS Codes

//From https://codepen.io/fmtoffolo/details/vruqB/ just changed svg path
var sky = document.getElementsByClassName('clouds')[0]; screenWidth = window.screen.width, boxHeight = 300, clouds = [], path = "M100.434,26.461c-2.076-6.246-7.969-10.752-14.911-10.752c-4.093,0-7.807,1.577-10.603,4.14C71.763,8.411,61.309,0,48.865,0C37.991,0,28.643,6.428,24.343,15.678c-2.577-2.158-5.893-3.459-9.517-3.459C6.828,12.219,0.308,18.547,0,26.471L100.434,26.461z";
var cloud = function (screenWidth, boxHeight) { var yPos = Math.random()*boxHeight, xPos = Math.random()*screenWidth, speed = Math.random(), direction = Math.random(), scale = speed, scaleString = 'scale(' + scale + ' ' + scale + ')', opacity = scale; var cloud = document.createElementNS("http://www.w3.org/2000/svg", 'path');//create SVG cloud.setAttribute('d', path);//set path cloud.setAttribute('fill', "white");//color cloud.setAttribute('fill-opacity', opacity); if(direction > 0.5){//set random direction speed = -speed; } sky.appendChild(cloud);//put clouds in the sky this.animate = function(){//animation method cloud.setAttribute('transform', 'translate('+ (xPos+=speed) +','+ yPos +')' + scaleString ); if(xPos > screenWidth + 200){ xPos = -200; yPos = Math.random()*boxHeight; } if(xPos < -200){ xPos = screenWidth + 200; yPos = Math.random()*boxHeight; } };
};
var createClouds = function(quantity){ for (var i = 0; i < quantity; i++) {//create clouds and put them inside array clouds.push(new cloud(screenWidth, boxHeight)); }
};
var render = function(){//call the animate method from each cloud and control flow with requestAnimationFrame for (var i = 0; i < clouds.length; i++) { clouds[i].animate(); } requestAnimationFrame(render);
};
createClouds(10);
render();
Plane, Goodbye - Script Codes
Plane, Goodbye - Script Codes
Home Page Home
Developer B.
Username wearebold
Uploaded December 21, 2022
Rating 3
Size 9,358 Kb
Views 16,192
Do you need developer help for Plane, Goodbye?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

B. (wearebold) Script Codes
Create amazing sales emails with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!