different div on page refresh

[yomoore]

Hi,

I have three divs with a feed:

<div>feed nr.1</div>
<div>feed nr.2</div>
<div>feed nr.3</div>

I would like to hide div 2 and three and show only div 1.
Than one page refresh I would like to hide div 1 and than show div 2 etc. In this order. So every page refresh would show a different div in the order of 1,2,3 etc.

Thanks

[interfacetricks]

You can use the document.cookie which is a value you can control from any page on your site, and which stays on the user's computer even when they refresh, or leave your page and come back.

So you can detect what its current value is and change it to reflect how many times they've visited your page.

To show or hide the "div" you can set its style.display property, eg.

//hides divobject:
divobject.style.display = "none"; 

// Shows divobject (makes it its default display options)
divobject.style.display = "";

I've made an example of showing different things depending on number of page views. You can test it out here.

http://webinterfacetricks.com/change_on_refresh/

There's more explanation in the source code but please let me know if anything is unclear.

Note that users can set their browser not to accept cookies, and can delete them manually or have them automatically deleted when they close their browser down.

But I think most people accept cookies at least temporarily.