How do you reset the visited state of your buttons on each page view?>

I am setting up a site here  and when you click on the buttons down the bottom the visited state turns red.
I would like the visited state to be removed after you shut the browser so when you return to the site a second time, the visited state has been removed and you are back to the normal colour?
LVL 11
Amanda WatsonWeb DeveloperAsked:
Who is Participating?

Improve company productivity with a Business Account.Sign Up

radnbneConnect With a Mentor Commented:

Things are getting a little confusing here.......

What you are trying to achieve is out of the range of your control within the browser unless you manually manage the visited state.  This is because the actual state of the visited links is maintained on the clients browser and not on the server.  Unless you have control over every client visiting you cannot clear the visited state.

Is the desire to remove the visited link a request from the client or a personal preference?  I ask because the visited link state is by design, and has worked that way for years.

From the information above you have a couple of options:

1) Use CSS to simply hide the visited state completely
2) Use one of the coding solutions linked to and modify it to reset the link on page load

From your earlier comment you have ruled out removing the visited state completely stating you still want it to work.  The sticking point is when to expired the visited link.

You essentially will need to change the code to reset when the session ID changes.  This is needed because if you are building a static page and someone clicks on one of the links and then comes back to the page it reloads.  If the code resets on load then the visited links would disappear each tiem the page is loaded.

So to make this work you need to do the following:

When the page is loaded check if a cookie exists with the current session ID, if it does, don't reset anything, if it doesn't, reset the visited link and update the cookie with the current session ID.

Before we can do this we need to know a few things.  What sort of web server is this running on (windows or unix) and are you using php or asp?

Does this make sense or have I confused you more ?

Rajesh DalmiaCommented:
u can try one thing.
remove the a:visited part from your css file...
move the script of a:visited into a:hover...
this way the red color will be visible only on mouse hover
radnbneConnect With a Mentor Commented:
Alternatively you can manually manage the links.

A Javascript option is provided here:

about half way down the page
Get 10% Off Your First Squarespace Website

Ready to showcase your work, publish content or promote your business online? With Squarespace’s award-winning templates and 24/7 customer service, getting started is simple. Head to and use offer code ‘EXPERTS’ to get 10% off your first purchase.

Amanda WatsonWeb DeveloperAuthor Commented:
Do you mean this solution here?
 1  down vote

So you just want to make "visited" links look different for a certain amount of time? This is easy if you bypass the browser's :visited pseudoclass and just assign a custom class name. Use cookies; they've got built-in expiration.

Set up a JavaScript handler for when you click on links. Pseudo-code:

function clickHandler(event) {
  var href = /* (figure out which anchor was clicked and get the href) */
  // (you might need to escape the href)

  setCookie(href, "visited", 5); // set cookie for 5 days

It'll run this function right before it follows the link.

Then, on page load, you can do something like this:

function markVisitedLinks() {
  var anchors = document.getElementsByTagName("a");

  for (var i = 0; i < anchors.length; i++) {
    if (readCookie(anchors[i].href) == "visited") {
      anchors[i].className += " visited";

Grab the setCookie and readCookie functions from QuirksMode.

How do I do this.
Can you supply more steps.  Also I don't want it to reset after days but after they visit the site again?
konathalaConnect With a Mentor Commented:
Hi there,
You need to plan something with cookies. Follow the link to get some basic idea on cookie deletion. Once you delete the cookies on browser exit your problem will be solved,

Its a simple document.cookie function.
Amanda WatsonWeb DeveloperAuthor Commented:
Here is another solution, but I don' t know how to do timestamps?

Can someone please explain the simplest solution with steps.   I am not using a dynamic site, this is just a simple plain html site?
Just make all color codes the same for a,a:visited, a:click,a:hover etc. or what color is you want in CSS file. otherwise color changes when state is changed.
dmeerenConnect With a Mentor Commented:
Or... You can add a random session code to your url of the links. But it's a bit overdone in my opinion, but it works.
Amanda WatsonWeb DeveloperAuthor Commented:
Ok I am really finding this a bit beyond me... I really need some steps to follow from start to finish to accomplish this.

I can't change the colors, then must remain the colors they are for visited etc.

What file do I need, where do I add it on the server, what do I need to add to my html document or css?
please look at this site for how to use CSS in your HTML file
sami_20031Connect With a Mentor Commented:
if i think this problem is related to  visitors browser. You can solve this by simply go to your browser setting and remove all the cookies and others and if u have new brower you only keep  your browsing history but some visitors my view your page as your trying to do by default
Amanda WatsonWeb DeveloperAuthor Commented:
ozi lion, I am pretty clear on using css thanks.  I am also understanding how to use active, hover, visited etc.
If you read my post you will see I am trying to work out a way to have the visited link reset when you come back to the website.  that is I want the cache to be cleared so the visited state is removed once you have left the site
Amanda WatsonWeb DeveloperAuthor Commented:
Thanks for your response Rad.... I clear on what needs to happen from this point:
When the page is loaded check if a cookie exists with the current session ID, if it does, don't reset anything, if it doesn't, reset the visited link and update the cookie with the current session ID.

Before we can do this we need to know a few things.  What sort of web server is this running on (windows or unix) and are you using php or asp?


I will test out this site on my server to begin with which is running windows and has php enabled.

I will need to find out if the live server is unix or windows but I am pretty sure it will have php enabled too.

The current site is SO basic...its just static html php is currently running on it, but it can
Amanda WatsonWeb DeveloperAuthor Commented:
Thanks for the help, I never had to finish this solution, but it certainly was the correct one...and hopefully will help someone else out..
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.