Comments on: Can I make different categories of link text on a web page show as "unvisited" after different intervals?

Question: Can I make different categories of link text on a web page show as "unvisited" after different intervals?

lorimer — Thu, 21 Jun 2007 05:44:00 -0800

With Javascript, CSS or anything else, can I make different categories of link text on the same web page behave differently? Specifically, if I wanted to make a page listing some links I need to visit daily, some I need to visit weekly and some I need to visit monthly -- could I make each category of link text change from "visited" color back to "unvisited" color after the appropriate number of days? Or if this can't be done, how would you solve this need (in a visual way, rather than just "keep a list manually of when you visit each")?

By: dmd

dmd — Thu, 21 Jun 2007 05:54:50 -0800

Well, my first question would be "why do you need to visit these daily/weekly/monthly?" - i.e., what is it that's updating there?

Presumably this is something that doesn't have an RSS feed? We need to know why RSS isn't the right answer here. Or are these links for which RSS wouldn't even make sense? (e.g. a bank statement - although, now that I say that, I'd love it if my bank would give me secure RSS of my transactions!).

By: jozxyqk

jozxyqk — Thu, 21 Jun 2007 05:55:42 -0800

Are you always accessing this page from the same computer?

If so, you could assign a "daily", "weekly", or "monthly" class to each link and set a client-side cookie with Javascript when you click on them, appropriately.

On preview: Yes, RSS would be your ideal solution if it's available.

By: cmiller

cmiller — Thu, 21 Jun 2007 05:58:42 -0800

You can't do this in-browser. Visitedness is a universal cutoff date.

You can send your browser through some portal that updates the page with a kind of "last clicked here" marker.

By: lorimer

lorimer — Thu, 21 Jun 2007 06:01:20 -0800

Yes, these are mostly pages that change irregularly and don't have rss feeds.

jozxyqk said exactly what I'm looking for -- can anybody tell me how to how to do that, or where I should go to learn how to do that?

By: desjardins

desjardins — Thu, 21 Jun 2007 06:07:06 -0800

you could use the Days Since add-on for iGoogle. Probably someone smarter than me can tell you how to incorporate it into your site. Looks like the code is open source.

By: jozxyqk

jozxyqk — Thu, 21 Jun 2007 06:15:18 -0800

Instead of changing the color of the link and dealing with classes, it would probably just be a lot easier to just have a last clicked on this link on such-and-such date label after each link.

There are plenty of Javascript tutorials out there; any of them should help you figure out how to do something like that.

Of course, there's no way to guarantee that you actually *got* to that link, without that link reporting something back to you (and then you'll probably have to get fancy with PHP or AJAX or something). With Javascript the best you'll be able to do is track when you clicked on it.

By: malevolent

malevolent — Thu, 21 Jun 2007 09:12:15 -0800

Yeah, it can be done with JavaScript and cookies; capture the clicks, store the dates in a cookie, and use that data to style the links appropriately. Not rocket science, but moderately complicated to code.

Have you considered using a personal organiser app (iCal, Outlook, Google Calendar, etc.) to prompt you to visit these URLs?

By: Rhomboid

Rhomboid — Thu, 21 Jun 2007 12:37:35 -0800

Right so the basic outline of doing this in JS would be have the links call some JS function:

<a href="http://site1.example.com" onclick="javascript:record_click(this);return false">

...where record_click(foo) somehow encodes foo.href and the current date/time into an alphanumeric string, and then sets that string in a cookie (document.cookie = string) on the current page.

Then you'd have an onload script that walks the DOM for all A elements, extracts their href, checks all the cookies in the current page for one that matches, extracts/decodes the last click time, and computes whether it's before or after the desired cutoff. Based on that decision, add a class to the 'a' element, which you can reference from the stylesheet to set the color.

As a refinement, you could set a class on the links that determines their cutoff time:

<a class="oneweek" href="http://site1.example.com" onclick="javascript:record_click(this);return false">
<a class="onemonth" href="http://site2.example.com" onclick="javascript:record_click(this);return false">

In your onload handler, you'd check for the presense of these class values and use that to determine if the cutoff has happened or not.

By: Rhomboid

Rhomboid — Thu, 21 Jun 2007 12:42:01 -0800

Oh and just in case it wasn't clear, when encoding the cookie values you'd want the format to be asciiurl=datevalue, where asciiurl is a ascii-ified version of the HREF and datevalue is something easily parsed, e.g. unixtime. That way each click on url overwrites the previous value of the cookie; and you can easily scan the part on the LHS of the = for a given URL