Find Jobs
Hire Freelancers

Start animation when page is loaded

€2-6 EUR / hour

Dokončeno
Zveřejněno skoro před 6 roky

€2-6 EUR / hour

The animation starts when you click on the button but it should start, when you load the page HTML <div id="flight" class="flight"></div> <div class="runway"> <div class="runwayNo"></div> </div> <div class="controls"> <button onclick="simulate()">TAKE OFF</button> </div> <div class="twintowerblack"><img src="pics/[login to view URL]" alt="Twintower Schwarz"></div> <script> function simulate(){ $("#flight").addClass("run"); setTimeout(function(){ $("#flight").removeClass("run"); },10000) } </script> CSS .flight { width: 200px; height: 100px; background: url("pics/[login to view URL]") center no-repeat; background-size: 100%; position: fixed; bottom: -8px; right: 0; } .[login to view URL] { animation: landFlight linear 10s; } .runway { width: 95%; height: 1px; border-top: 1px dotted #eee; background: #333; position: fixed; bottom: 5px; right: 0; } .runway .runwayNo { position: absolute; width: 50px; color: #fff; bottom: 23px; left: -30px; text-align: center; padding: 5px 0; } .runway .runwayNo:after { position: absolute; height: 20px; width: 10px; border: 1px dotted #fff; content: ''; bottom: -23px; left: 18px; } @keyframes landFlight { 0% { -ms-transform: translate(0, 0) rotate(0deg); -moz-transform: translate(0, 0) rotate(0deg); -webkit-transform: translate(0, 0) rotate(0deg); transform: translate(0, 0) rotate(0deg); } 20% { -ms-transform: translate(-400px, -1px) rotate(0deg); -moz-transform: translate(-400px, -1px) rotate(0deg); -webkit-transform: translate(-400px, -1px) rotate(0deg); transform: translate(-400px, -1px) rotate(0deg); } 30% { -ms-transform: translate(-450px, -2px) rotate(0deg); -moz-transform: translate(-450px, -2px) rotate(0deg); -webkit-transform: translate(-450px, -2px) rotate(0deg); transform: translate(-450px, -2px) rotate(0deg); } 38% { -ms-transform: translate(-500px, -5px) rotate(10deg); -moz-transform: translate(-500px, -5px) rotate(10deg); -webkit-transform: translate(-500px, -5px) rotate(10deg); transform: translate(-500px, -5px) rotate(10deg); } 39% { -ms-transform: translate(-510px, -10px) rotate(15deg); -moz-transform: translate(-510px, -10px) rotate(15deg); -webkit-transform: translate(-510px, -10px) rotate(15deg); transform: translate(-510px, -10px) rotate(15deg); } 40% { -ms-transform: translate(-520px, -12px) rotate(20deg); -moz-transform: translate(-520px, -12px) rotate(20deg); -webkit-transform: translate(-520px, -12px) rotate(20deg); transform: translate(-520px, -12px) rotate(20deg); } 50% { -ms-transform: translate(-600px, -50px) rotate(20deg); -moz-transform: translate(-600px, -50px) rotate(20deg); -webkit-transform: translate(-600px, -50px) rotate(20deg); transform: translate(-600px, -50px) rotate(20deg); } 60% { -ms-transform: translate(-700px, -100px) rotate(20deg); -moz-transform: translate(-700px, -100px) rotate(20deg); -webkit-transform: translate(-700px, -100px) rotate(20deg); transform: translate(-700px, -100px) rotate(20deg); } 100% { -ms-transform: translate(-2000px, -750px) rotate(20deg); -moz-transform: translate(-2000px, -750px) rotate(20deg); -webkit-transform: translate(-2000px, -750px) rotate(20deg); transform: translate(-2000px, -750px) rotate(20deg); } } .controls button { border: 0; outline: 0; color: #000; background: lightskyblue; padding:61.3px; cursor: pointer; }
IČ projektu: 16895121

O projektu

11 nabídky
Vzdálený projekt
Aktivní před 6 roky

Chcete si vydělat nějaké peníze?

Výhody podávání nabídek na Freelancer

Stanovte si rozpočet a časový rámec
Získejte za svou práci zaplaceno
Načrtněte svůj návrh
Registrace a podávání nabídek je zdarma
Uděleno:
Avatar uživatele
Hi! I CAN DO THIS NOW I am Expert in PHP,WORDPRESS,MYSQL,HTML5-HTML,JAVASCRIPT,CSS,AJAX etc..... I have 5+yr experience in developing as well as designing field... I can do this work easily and quickly..... Thankyou waiting for your response.....
€5 EUR v 1 dni
5,0 (136 recenze)
5,7
5,7
11 freelanceři nabízejí v průměru €5 EUR/hodinu za tuto práci
Avatar uživatele
Hello. I can modify the animation script to make it run on page load instead of button click. I am competent in JavaScript, HTML and CSS.
€6 EUR v 40 dnech
5,0 (250 recenze)
7,6
7,6
Avatar uživatele
hi sir, i will make the animation to start on page load, ready to do it right now, thanks................
€2 EUR v 40 dnech
4,9 (526 recenze)
7,0
7,0
Avatar uživatele
Hello I can make your animation work on onload aswel just message me to start . Thank you Balouch Khan
€6 EUR v 25 dnech
5,0 (95 recenze)
6,3
6,3
Avatar uživatele
Hello Hiring manager I have gone through your post and I am interested to work on it .As I have lot of experience in relevant field and I have 100% confidence to work on your project. Skill- Php, Magento, Laravel, Wordpress, Android etc Web (Html, Laravel & Core Php, Wodpress, Joomla) UI/UX Design (Photoshop & Illustrator) Lets Connect and start the project ASAP. For any query , feel free to connect me. Please message me to discuss further for its development. Thank you
€5 EUR v 40 dnech
5,0 (26 recenze)
4,6
4,6
Avatar uživatele
A proposal has not yet been provided
€11 EUR v 3 dnech
4,9 (8 recenze)
2,6
2,6
Avatar uživatele
I work primarily with font end hmtl/css/js /jQuery in my projects and often times handle animations in css and js. Without prior testing, it sounds like its probably an event listener issue and should be a relatively easy fix in the js.
€4 EUR v 40 dnech
0,0 (1 recenze)
0,0
0,0

O klientovi

Pochází z GERMANY
Güstrow, Germany
4,9
3
Ověřená platební metoda
Členem od kvě 3, 2018

Ověření klienta

Díky! Poslali jsme vám e-mailem odkaz pro získání kreditu zdarma.
Při odesílání e-mailu se něco pokazilo. Zkuste to prosím znovu.
Registrovaných uživatelů Zveřejněných projektů
Freelancer ® is a registered Trademark of Freelancer Technology Pty Limited (ACN 142 189 759)
Copyright © 2024 Freelancer Technology Pty Limited (ACN 142 189 759)
Načítání náhledu
Bylo uděleno povolení ke geolokaci.
Vaše doba přihlášení vypršela a byli jste odhlášeni. Přihlaste se znovu.