En curso

Prevent animation from running when BACK button clicked

Would you please go to [url removed, login to view]

You'll see an animation.

In Chrome, IE & Edge, if you click on the Stackoverflow link and then click the back button, the animation doesn't run BUT the animated text hasn't maintained its final state (it no longer has height:0, overflow:hidden).

In Firefox, when you click the back button it looks perfect, but if you refresh the page the previously animated text becomes visible

You'll see that on line 60 of the CSS is animation-fill-mode:forwards;

This works as it should without the script.

This is what I'd like to achieve (and I suspect that sessionStorage will be necessary because onbeforeunload doesn't differentiate between navigating away from the page and then returning to it in the same tab, and closing the tab/exiting the browser).

1. When a user visits the page, the animation runs.

2. When the user follows a link on that page, and then clicks the back button, the animation does not run, but the page should look as it did when they left it (in this example, height:0 andoverflow:hidden)

3. If the user closes the tab or exits the browser, when they revisit the page, the animation runs

4. I'd like whatever you write to be usable on other pages.

5. I'd like to understand how your code works - LOTS of comments please

6. I won't make the final payment based on screenshots, but if you want to make a screen-capture video which clearly shows that you've achieved the requirements, I'd pay on that.

Habilidades: HTML5, Javascript

Ver más: webdesign works, webdesign 2016, make animation from video, how to make a video animation, how to make animation video, how to make animation in video, how to make animation from video, how to make an animation video, how to make a animation video, animation on line

Información del empleador:
( 4 comentarios ) Brisbane, Australia

Nº del proyecto: #10658118

Adjudicado a:


I've played around with your animation a little bit and have a fairly good idea of what you're trying to achieve and how to go about it. I'm new to this site, but not to web development. I've been doing this profes Más

$45 AUD en 1 día
(0 comentarios)

2 freelancers están ofertando el promedio de $128 para este trabajo


Hello, We are a Web Design and Development company with expertise in latest and legacy technologies to create an awesome product for you. We have he best project management practices to ensure that your project is comp Más

$210 AUD en 5 días
(0 comentarios)

Hello, sir. I read your proposal and understood. I have a lot of experience with CSS. I am a new freelancer, but I have developed several website before. Looking forward to hearing you soon. Regards.

$100 AUD en 3 días
(0 comentarios)