How can one make an animation run only once per session only at the beginning of the session using jQuery?

Goal

During the loading of the site have a div fixed to the top of the browser window named #topbar start off at height: 100% & opacity: 1.0 and .animate() down to height: 2px & opacity: 0.2.

This animation will broadcast upon the loading of any page 开发者_JS百科of the site; it just has to be the first page load of each new session. If a visitor leaves the site and then reloads any page from it 5 minutes later, they will see this same animation take place once again.

How can one accomplish this via jQuery?

---

cookies the best way as The Scrum Meister pointed.

check is there any foobar cookie if yes than not to do the animaztion, if not then set a cookie for 5 minutes expire or what start the animation

and another code is good: on every page create an ajax function which resets the expiration time

for example

setcookie(date) //this sets your cookies you should implement for yourself
func setagain() {
    setcookie(expanded_date);
    window.setTimeot(setagain,10000);
} 

if(iscookie() == true) {
setagain()
}
else {
animate()
setagain();
}

cookies tutorial: http://www.w3schools.com/JS/js_cookies.asp

---

According to: http://api.jquery.com/animate/

With that in mind I would use Ajax to set some sort of Session. ie: <?php session_start(); $_SESSION['animate']=true; $_SESSION['animate_time']=time(); ?>

And you can check if the session is set and the time when it was created.

<?php
$time_till_animate = 60*5;//5 minutes
session_start(); 
if(isset($_SESSION['animate']) && isset($_SESSION['animate_time'])){
if((time()-$_SESSION['animate_time']) > $time_till_animate){
     //Animate
}}else{
     //Animate
}

from then on you are set.

PS: I'm sure there are plenty of better ways to do it. (not sure if you use PHP, just ignore if you dont)