Can I use the CSS :visited pseudo class on 'wildcard' links?

Question

Let's say I have a site with multiple links as follows:

www.example.com/product/1
www.example.com/product/2
www.example.com/product/3

I also append tracking info to links from time to time so that I can see how my site is being used, e.g, if somebody visits the products page from the product browser I would set a ref parameter:

www.example.com/product/1&ref=pb
www.example.com/product/2&ref=pb
www.example.com/product/3&ref=pb

The problem with this is that if the user visits a link of the first type and then views a link of the second type then the :visited pseudo class doesn't seem to apply because the browser only seems to match on exact URLs. Is there any way to have "wildcards" apply to links in this sense, so that when the user sees either the first type or the second type of link that it is highlighted?

Note: I cannot change this "ref" architecture; it is inherited.

Answer 1

I'm pretty sure the answer is 'no'.

Answer 2

If the URL varies by even one character it's not the same URL. So ... no.

Answer 3

You might be able to do this with javascript. You could code your links as follows

<a href="www.example.com/product/1" onclick="document.location.href='www.example.com/product/1&ref=ab';return false;">

For anybody with a javascript enabled, you will see the visiting www.example.com/product/1&ref=ab, and their browser will detect all links with href=www.example.com/product/1 as the same link. And style them appropriately according to the :Visited pseudoclass. The only downside is that you won't get ref information for those without Javascript. Whether or not that's an accetable tradeoff depends on your requirements.

You could also do something like:

<a href="www.example.com/product/1" onclick="document.location.href=this.href + '&ref=ab';return false;">

so you don't have to code the url in there twice. You could probably even create a function return the proper link, picking up the ref value from a single place.