Fly to Future

Developer

Size

4,940 Kb

Views

24,288

Fly to Future Previews
Fly to Future HTML Codes
Fly to Future CSS Codes

How do I make an fly to future?

I hope I have a time machine.. What is a fly to future? How do you make a fly to future? This script and codes were developed by AaronChuo (小狂) on 11 September 2022, Sunday.

Fly to Future Previews

Fly to Future - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Fly to Future</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/meyer-reset/2.0/reset.min.css"> <link rel="stylesheet" href="css/style.css">
</head>
<body> <ul> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li>
</ul> <script src='http://ajax.googleapis.com/ajax/libs/angularjs/1.3.2/angular.min.js'></script>
</body>
</html>

Fly to Future - Script Codes CSS Codes

html, body { background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PHJhZGlhbEdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY3g9IjUwJSIgY3k9IjUwJSIgcj0iMTIwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIvPjxzdG9wIG9mZnNldD0iMTIwJSIgc3RvcC1jb2xvcj0iIzExMjIzMyIvPjwvcmFkaWFsR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-radial-gradient(center center, circle, #000000 0%, #112233 120%); background-image: -webkit-radial-gradient(center center circle, #000000 0%, #112233 120%); background-image: radial-gradient(circle at center center, #000000 0%, #112233 120%); overflow: hidden; width: 100%; height: 100%;
}
ul { -webkit-transition: all 200ms cubic-bezier(1, 1.2, 0.8, 1.2); transition: all 200ms cubic-bezier(1, 1.2, 0.8, 1.2); width: 100%; height: 100%;
}
ul:hover { -webkit-transform: rotate(45deg); transform: rotate(45deg);
}
ul:hover li { box-shadow: 0 0 50px #6CC; background: #6CC;
}
ul li { box-shadow: 0 0 10px #399; -webkit-transform-origin: center top; transform-origin: center top; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; position: absolute; top: 50%; left: 50%; display: block; width: 1px; background: #399;
}
ul li:nth-child(1) { -webkit-animation: forward1 800ms infinite 50ms linear; animation: forward1 800ms infinite 50ms linear; -webkit-transform: rotate(0deg) translateY(35px) perspective(20px); transform: rotate(0deg) translateY(35px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 255px;
}
ul li:nth-child(2) { -webkit-animation: forward2 800ms infinite 84ms linear; animation: forward2 800ms infinite 84ms linear; -webkit-transform: rotate(9deg) translateY(39px) perspective(20px); transform: rotate(9deg) translateY(39px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 224px;
}
ul li:nth-child(3) { -webkit-animation: forward3 800ms infinite 114ms linear; animation: forward3 800ms infinite 114ms linear; -webkit-transform: rotate(18deg) translateY(15px) perspective(20px); transform: rotate(18deg) translateY(15px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 184px;
}
ul li:nth-child(4) { -webkit-animation: forward4 800ms infinite 304ms linear; animation: forward4 800ms infinite 304ms linear; -webkit-transform: rotate(27deg) translateY(65px) perspective(20px); transform: rotate(27deg) translateY(65px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 66px;
}
ul li:nth-child(5) { -webkit-animation: forward5 800ms infinite 150ms linear; animation: forward5 800ms infinite 150ms linear; -webkit-transform: rotate(36deg) translateY(43px) perspective(20px); transform: rotate(36deg) translateY(43px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 75px;
}
ul li:nth-child(6) { -webkit-animation: forward6 800ms infinite 132ms linear; animation: forward6 800ms infinite 132ms linear; -webkit-transform: rotate(45deg) translateY(17px) perspective(20px); transform: rotate(45deg) translateY(17px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 221px;
}
ul li:nth-child(7) { -webkit-animation: forward7 800ms infinite 105ms linear; animation: forward7 800ms infinite 105ms linear; -webkit-transform: rotate(54deg) translateY(9px) perspective(20px); transform: rotate(54deg) translateY(9px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 132px;
}
ul li:nth-child(8) { -webkit-animation: forward8 800ms infinite 120ms linear; animation: forward8 800ms infinite 120ms linear; -webkit-transform: rotate(63deg) translateY(57px) perspective(20px); transform: rotate(63deg) translateY(57px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 62px;
}
ul li:nth-child(9) { -webkit-animation: forward9 800ms infinite 405ms linear; animation: forward9 800ms infinite 405ms linear; -webkit-transform: rotate(72deg) translateY(71px) perspective(20px); transform: rotate(72deg) translateY(71px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 96px;
}
ul li:nth-child(10) { -webkit-animation: forward10 800ms infinite 250ms linear; animation: forward10 800ms infinite 250ms linear; -webkit-transform: rotate(81deg) translateY(71px) perspective(20px); transform: rotate(81deg) translateY(71px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 233px;
}
ul li:nth-child(11) { -webkit-animation: forward11 800ms infinite 451ms linear; animation: forward11 800ms infinite 451ms linear; -webkit-transform: rotate(90deg) translateY(51px) perspective(20px); transform: rotate(90deg) translateY(51px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 282px;
}
ul li:nth-child(12) { -webkit-animation: forward12 800ms infinite 24ms linear; animation: forward12 800ms infinite 24ms linear; -webkit-transform: rotate(99deg) translateY(61px) perspective(20px); transform: rotate(99deg) translateY(61px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 153px;
}
ul li:nth-child(13) { -webkit-animation: forward13 800ms infinite 377ms linear; animation: forward13 800ms infinite 377ms linear; -webkit-transform: rotate(108deg) translateY(67px) perspective(20px); transform: rotate(108deg) translateY(67px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 212px;
}
ul li:nth-child(14) { -webkit-animation: forward14 800ms infinite 476ms linear; animation: forward14 800ms infinite 476ms linear; -webkit-transform: rotate(117deg) translateY(37px) perspective(20px); transform: rotate(117deg) translateY(37px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 296px;
}
ul li:nth-child(15) { -webkit-animation: forward15 800ms infinite 60ms linear; animation: forward15 800ms infinite 60ms linear; -webkit-transform: rotate(126deg) translateY(41px) perspective(20px); transform: rotate(126deg) translateY(41px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 204px;
}
ul li:nth-child(16) { -webkit-animation: forward16 800ms infinite 960ms linear; animation: forward16 800ms infinite 960ms linear; -webkit-transform: rotate(135deg) translateY(79px) perspective(20px); transform: rotate(135deg) translateY(79px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 119px;
}
ul li:nth-child(17) { -webkit-animation: forward17 800ms infinite 408ms linear; animation: forward17 800ms infinite 408ms linear; -webkit-transform: rotate(144deg) translateY(81px) perspective(20px); transform: rotate(144deg) translateY(81px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 65px;
}
ul li:nth-child(18) { -webkit-animation: forward18 800ms infinite 720ms linear; animation: forward18 800ms infinite 720ms linear; -webkit-transform: rotate(153deg) translateY(85px) perspective(20px); transform: rotate(153deg) translateY(85px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 208px;
}
ul li:nth-child(19) { -webkit-animation: forward19 800ms infinite 1235ms linear; animation: forward19 800ms infinite 1235ms linear; -webkit-transform: rotate(162deg) translateY(47px) perspective(20px); transform: rotate(162deg) translateY(47px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 143px;
}
ul li:nth-child(20) { -webkit-animation: forward20 800ms infinite 760ms linear; animation: forward20 800ms infinite 760ms linear; -webkit-transform: rotate(171deg) translateY(15px) perspective(20px); transform: rotate(171deg) translateY(15px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 134px;
}
ul li:nth-child(21) { -webkit-animation: forward21 800ms infinite 609ms linear; animation: forward21 800ms infinite 609ms linear; -webkit-transform: rotate(180deg) translateY(65px) perspective(20px); transform: rotate(180deg) translateY(65px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 69px;
}
ul li:nth-child(22) { -webkit-animation: forward22 800ms infinite 1056ms linear; animation: forward22 800ms infinite 1056ms linear; -webkit-transform: rotate(189deg) translateY(17px) perspective(20px); transform: rotate(189deg) translateY(17px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 107px;
}
ul li:nth-child(23) { -webkit-animation: forward23 800ms infinite 1265ms linear; animation: forward23 800ms infinite 1265ms linear; -webkit-transform: rotate(198deg) translateY(23px) perspective(20px); transform: rotate(198deg) translateY(23px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 171px;
}
ul li:nth-child(24) { -webkit-animation: forward24 800ms infinite 936ms linear; animation: forward24 800ms infinite 936ms linear; -webkit-transform: rotate(207deg) translateY(55px) perspective(20px); transform: rotate(207deg) translateY(55px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 286px;
}
ul li:nth-child(25) { -webkit-animation: forward25 800ms infinite 1375ms linear; animation: forward25 800ms infinite 1375ms linear; -webkit-transform: rotate(216deg) translateY(45px) perspective(20px); transform: rotate(216deg) translateY(45px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 139px;
}
ul li:nth-child(26) { -webkit-animation: forward26 800ms infinite 1508ms linear; animation: forward26 800ms infinite 1508ms linear; -webkit-transform: rotate(225deg) translateY(53px) perspective(20px); transform: rotate(225deg) translateY(53px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 126px;
}
ul li:nth-child(27) { -webkit-animation: forward27 800ms infinite 540ms linear; animation: forward27 800ms infinite 540ms linear; -webkit-transform: rotate(234deg) translateY(33px) perspective(20px); transform: rotate(234deg) translateY(33px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 298px;
}
ul li:nth-child(28) { -webkit-animation: forward28 800ms infinite 1232ms linear; animation: forward28 800ms infinite 1232ms linear; -webkit-transform: rotate(243deg) translateY(35px) perspective(20px); transform: rotate(243deg) translateY(35px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 270px;
}
ul li:nth-child(29) { -webkit-animation: forward29 800ms infinite 1160ms linear; animation: forward29 800ms infinite 1160ms linear; -webkit-transform: rotate(252deg) translateY(69px) perspective(20px); transform: rotate(252deg) translateY(69px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 144px;
}
ul li:nth-child(30) { -webkit-animation: forward30 800ms infinite 1800ms linear; animation: forward30 800ms infinite 1800ms linear; -webkit-transform: rotate(261deg) translateY(63px) perspective(20px); transform: rotate(261deg) translateY(63px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 135px;
}
ul li:nth-child(31) { -webkit-animation: forward31 800ms infinite 434ms linear; animation: forward31 800ms infinite 434ms linear; -webkit-transform: rotate(270deg) translateY(47px) perspective(20px); transform: rotate(270deg) translateY(47px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 261px;
}
ul li:nth-child(32) { -webkit-animation: forward32 800ms infinite 1600ms linear; animation: forward32 800ms infinite 1600ms linear; -webkit-transform: rotate(279deg) translateY(65px) perspective(20px); transform: rotate(279deg) translateY(65px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 240px;
}
ul li:nth-child(33) { -webkit-animation: forward33 800ms infinite 99ms linear; animation: forward33 800ms infinite 99ms linear; -webkit-transform: rotate(288deg) translateY(9px) perspective(20px); transform: rotate(288deg) translateY(9px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 296px;
}
ul li:nth-child(34) { -webkit-animation: forward34 800ms infinite 1292ms linear; animation: forward34 800ms infinite 1292ms linear; -webkit-transform: rotate(297deg) translateY(25px) perspective(20px); transform: rotate(297deg) translateY(25px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 210px;
}
ul li:nth-child(35) { -webkit-animation: forward35 800ms infinite 1470ms linear; animation: forward35 800ms infinite 1470ms linear; -webkit-transform: rotate(306deg) translateY(13px) perspective(20px); transform: rotate(306deg) translateY(13px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 194px;
}
ul li:nth-child(36) { -webkit-animation: forward36 800ms infinite 108ms linear; animation: forward36 800ms infinite 108ms linear; -webkit-transform: rotate(315deg) translateY(67px) perspective(20px); transform: rotate(315deg) translateY(67px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 73px;
}
ul li:nth-child(37) { -webkit-animation: forward37 800ms infinite 2331ms linear; animation: forward37 800ms infinite 2331ms linear; -webkit-transform: rotate(324deg) translateY(49px) perspective(20px); transform: rotate(324deg) translateY(49px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 57px;
}
ul li:nth-child(38) { -webkit-animation: forward38 800ms infinite 760ms linear; animation: forward38 800ms infinite 760ms linear; -webkit-transform: rotate(333deg) translateY(15px) perspective(20px); transform: rotate(333deg) translateY(15px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 145px;
}
ul li:nth-child(39) { -webkit-animation: forward39 800ms infinite 741ms linear; animation: forward39 800ms infinite 741ms linear; -webkit-transform: rotate(342deg) translateY(43px) perspective(20px); transform: rotate(342deg) translateY(43px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 83px;
}
ul li:nth-child(40) { -webkit-animation: forward40 800ms infinite 1320ms linear; animation: forward40 800ms infinite 1320ms linear; -webkit-transform: rotate(351deg) translateY(43px) perspective(20px); transform: rotate(351deg) translateY(43px) perspective(20px); filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; height: 220px;
}
@-webkit-keyframes forward1 { 100% { -webkit-transform: rotate(0deg) translateY(500px) perspective(120px); transform: rotate(0deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward1 { 100% { -webkit-transform: rotate(0deg) translateY(500px) perspective(120px); transform: rotate(0deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward2 { 100% { -webkit-transform: rotate(9deg) translateY(500px) perspective(120px); transform: rotate(9deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward2 { 100% { -webkit-transform: rotate(9deg) translateY(500px) perspective(120px); transform: rotate(9deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward3 { 100% { -webkit-transform: rotate(18deg) translateY(500px) perspective(120px); transform: rotate(18deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward3 { 100% { -webkit-transform: rotate(18deg) translateY(500px) perspective(120px); transform: rotate(18deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward4 { 100% { -webkit-transform: rotate(27deg) translateY(500px) perspective(120px); transform: rotate(27deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward4 { 100% { -webkit-transform: rotate(27deg) translateY(500px) perspective(120px); transform: rotate(27deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward5 { 100% { -webkit-transform: rotate(36deg) translateY(500px) perspective(120px); transform: rotate(36deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward5 { 100% { -webkit-transform: rotate(36deg) translateY(500px) perspective(120px); transform: rotate(36deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward6 { 100% { -webkit-transform: rotate(45deg) translateY(500px) perspective(120px); transform: rotate(45deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward6 { 100% { -webkit-transform: rotate(45deg) translateY(500px) perspective(120px); transform: rotate(45deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward7 { 100% { -webkit-transform: rotate(54deg) translateY(500px) perspective(120px); transform: rotate(54deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward7 { 100% { -webkit-transform: rotate(54deg) translateY(500px) perspective(120px); transform: rotate(54deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward8 { 100% { -webkit-transform: rotate(63deg) translateY(500px) perspective(120px); transform: rotate(63deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward8 { 100% { -webkit-transform: rotate(63deg) translateY(500px) perspective(120px); transform: rotate(63deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward9 { 100% { -webkit-transform: rotate(72deg) translateY(500px) perspective(120px); transform: rotate(72deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward9 { 100% { -webkit-transform: rotate(72deg) translateY(500px) perspective(120px); transform: rotate(72deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward10 { 100% { -webkit-transform: rotate(81deg) translateY(500px) perspective(120px); transform: rotate(81deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward10 { 100% { -webkit-transform: rotate(81deg) translateY(500px) perspective(120px); transform: rotate(81deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward11 { 100% { -webkit-transform: rotate(90deg) translateY(500px) perspective(120px); transform: rotate(90deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward11 { 100% { -webkit-transform: rotate(90deg) translateY(500px) perspective(120px); transform: rotate(90deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward12 { 100% { -webkit-transform: rotate(99deg) translateY(500px) perspective(120px); transform: rotate(99deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward12 { 100% { -webkit-transform: rotate(99deg) translateY(500px) perspective(120px); transform: rotate(99deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward13 { 100% { -webkit-transform: rotate(108deg) translateY(500px) perspective(120px); transform: rotate(108deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward13 { 100% { -webkit-transform: rotate(108deg) translateY(500px) perspective(120px); transform: rotate(108deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward14 { 100% { -webkit-transform: rotate(117deg) translateY(500px) perspective(120px); transform: rotate(117deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward14 { 100% { -webkit-transform: rotate(117deg) translateY(500px) perspective(120px); transform: rotate(117deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward15 { 100% { -webkit-transform: rotate(126deg) translateY(500px) perspective(120px); transform: rotate(126deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward15 { 100% { -webkit-transform: rotate(126deg) translateY(500px) perspective(120px); transform: rotate(126deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward16 { 100% { -webkit-transform: rotate(135deg) translateY(500px) perspective(120px); transform: rotate(135deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward16 { 100% { -webkit-transform: rotate(135deg) translateY(500px) perspective(120px); transform: rotate(135deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward17 { 100% { -webkit-transform: rotate(144deg) translateY(500px) perspective(120px); transform: rotate(144deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward17 { 100% { -webkit-transform: rotate(144deg) translateY(500px) perspective(120px); transform: rotate(144deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward18 { 100% { -webkit-transform: rotate(153deg) translateY(500px) perspective(120px); transform: rotate(153deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward18 { 100% { -webkit-transform: rotate(153deg) translateY(500px) perspective(120px); transform: rotate(153deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward19 { 100% { -webkit-transform: rotate(162deg) translateY(500px) perspective(120px); transform: rotate(162deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward19 { 100% { -webkit-transform: rotate(162deg) translateY(500px) perspective(120px); transform: rotate(162deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward20 { 100% { -webkit-transform: rotate(171deg) translateY(500px) perspective(120px); transform: rotate(171deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward20 { 100% { -webkit-transform: rotate(171deg) translateY(500px) perspective(120px); transform: rotate(171deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward21 { 100% { -webkit-transform: rotate(180deg) translateY(500px) perspective(120px); transform: rotate(180deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward21 { 100% { -webkit-transform: rotate(180deg) translateY(500px) perspective(120px); transform: rotate(180deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward22 { 100% { -webkit-transform: rotate(189deg) translateY(500px) perspective(120px); transform: rotate(189deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward22 { 100% { -webkit-transform: rotate(189deg) translateY(500px) perspective(120px); transform: rotate(189deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward23 { 100% { -webkit-transform: rotate(198deg) translateY(500px) perspective(120px); transform: rotate(198deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward23 { 100% { -webkit-transform: rotate(198deg) translateY(500px) perspective(120px); transform: rotate(198deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward24 { 100% { -webkit-transform: rotate(207deg) translateY(500px) perspective(120px); transform: rotate(207deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward24 { 100% { -webkit-transform: rotate(207deg) translateY(500px) perspective(120px); transform: rotate(207deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward25 { 100% { -webkit-transform: rotate(216deg) translateY(500px) perspective(120px); transform: rotate(216deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward25 { 100% { -webkit-transform: rotate(216deg) translateY(500px) perspective(120px); transform: rotate(216deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward26 { 100% { -webkit-transform: rotate(225deg) translateY(500px) perspective(120px); transform: rotate(225deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward26 { 100% { -webkit-transform: rotate(225deg) translateY(500px) perspective(120px); transform: rotate(225deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward27 { 100% { -webkit-transform: rotate(234deg) translateY(500px) perspective(120px); transform: rotate(234deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward27 { 100% { -webkit-transform: rotate(234deg) translateY(500px) perspective(120px); transform: rotate(234deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward28 { 100% { -webkit-transform: rotate(243deg) translateY(500px) perspective(120px); transform: rotate(243deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward28 { 100% { -webkit-transform: rotate(243deg) translateY(500px) perspective(120px); transform: rotate(243deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward29 { 100% { -webkit-transform: rotate(252deg) translateY(500px) perspective(120px); transform: rotate(252deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward29 { 100% { -webkit-transform: rotate(252deg) translateY(500px) perspective(120px); transform: rotate(252deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward30 { 100% { -webkit-transform: rotate(261deg) translateY(500px) perspective(120px); transform: rotate(261deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward30 { 100% { -webkit-transform: rotate(261deg) translateY(500px) perspective(120px); transform: rotate(261deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward31 { 100% { -webkit-transform: rotate(270deg) translateY(500px) perspective(120px); transform: rotate(270deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward31 { 100% { -webkit-transform: rotate(270deg) translateY(500px) perspective(120px); transform: rotate(270deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward32 { 100% { -webkit-transform: rotate(279deg) translateY(500px) perspective(120px); transform: rotate(279deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward32 { 100% { -webkit-transform: rotate(279deg) translateY(500px) perspective(120px); transform: rotate(279deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward33 { 100% { -webkit-transform: rotate(288deg) translateY(500px) perspective(120px); transform: rotate(288deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward33 { 100% { -webkit-transform: rotate(288deg) translateY(500px) perspective(120px); transform: rotate(288deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward34 { 100% { -webkit-transform: rotate(297deg) translateY(500px) perspective(120px); transform: rotate(297deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward34 { 100% { -webkit-transform: rotate(297deg) translateY(500px) perspective(120px); transform: rotate(297deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward35 { 100% { -webkit-transform: rotate(306deg) translateY(500px) perspective(120px); transform: rotate(306deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward35 { 100% { -webkit-transform: rotate(306deg) translateY(500px) perspective(120px); transform: rotate(306deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward36 { 100% { -webkit-transform: rotate(315deg) translateY(500px) perspective(120px); transform: rotate(315deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward36 { 100% { -webkit-transform: rotate(315deg) translateY(500px) perspective(120px); transform: rotate(315deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward37 { 100% { -webkit-transform: rotate(324deg) translateY(500px) perspective(120px); transform: rotate(324deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward37 { 100% { -webkit-transform: rotate(324deg) translateY(500px) perspective(120px); transform: rotate(324deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward38 { 100% { -webkit-transform: rotate(333deg) translateY(500px) perspective(120px); transform: rotate(333deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward38 { 100% { -webkit-transform: rotate(333deg) translateY(500px) perspective(120px); transform: rotate(333deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward39 { 100% { -webkit-transform: rotate(342deg) translateY(500px) perspective(120px); transform: rotate(342deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward39 { 100% { -webkit-transform: rotate(342deg) translateY(500px) perspective(120px); transform: rotate(342deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@-webkit-keyframes forward40 { 100% { -webkit-transform: rotate(351deg) translateY(500px) perspective(120px); transform: rotate(351deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}
@keyframes forward40 { 100% { -webkit-transform: rotate(351deg) translateY(500px) perspective(120px); transform: rotate(351deg) translateY(500px) perspective(120px); filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; width: 7px; }
}

Home Page	Home
Developer	AaronChuo (小狂)
Username	aaronchuo
Uploaded	September 11, 2022
Rating	4
Size	4,940 Kb
Views	24,288

Do you need developer help for Fly to Future?

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!

AaronChuo (小狂) (aaronchuo) Script Codes

Name	Size
Scifi-style Radio-based Tab	4,427 Kb
Random Displacement of Data Node	3,075 Kb
Animated Donut Chart	4,147 Kb
Ramen by pure CSS	8,684 Kb
Chopper by pure CSS, no image, no javascript	3,905 Kb
I drink and I know things	2,218 Kb
Scifi-style Interative Form	4,566 Kb
Gradient Color Spin	2,986 Kb
Wave	3,550 Kb
BBQ by pure CSS, no image, no javascript	8,395 Kb

Create amazing marketing copy 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!

Similar Scripts & Codes

Name	Username	Size
A Pen by Anoop	Anoopjohn	330,760 Kb
TheCalendar.js	The-teacher	6,330 Kb
Simple Flat Menu	Jeplaa	2,467 Kb
LAMP PURE CSS with Animation	Dam62500	2,911 Kb
Simple blog concept	Drew_mc	2,666 Kb
Fluid Grid 12	Alexoliverwd	2,309 Kb
Pure CSS albums gallery	Renaudtertrais	2,978 Kb
Content Changer	Cliffpyles	4,538 Kb
React Template	Isac	1,241 Kb
Scifi-style Radio-based Tab	Aaronchuo	4,427 Kb

Do you want hide your ip address?

Surf anonymously, prevent hackers from acquiring your IP address, send anonymous email, and encrypt your Internet connection. High speed, ultra secure, and easy to use. Instant setup. Hide Your IP Now!