How do links know they have been visited?

S

Simon Wigzell

I wish to duplicate text link behaviour with some button images. Hover is
easy but other than saving cookies how can I know if the page that the
button liks to has been visited so that I can display a different image?

With text links the link knows if it has been visited, so there is something
available in the browser that is keeping track of every page visited. I
guess we see it also in the website url pulldown and auto complete as we are
typing links. Can I access this info with javascript?

Thanks.
 
S

SAM

Simon Wigzell a écrit :
I wish to duplicate text link behaviour with some button images. Hover is
easy but other than saving cookies how can I know if the page that the
button liks to has been visited so that I can display a different image?

It is a simple question of CSS,
no need of JS for that.

<style type="text/css">
a img { width: 98px; height: 32px; border: none; }
a { background: url(img1/jpg) no-repeat center center; }
a.visited { background-image: url(img2.jpg); }
a.hover { background-image: url(img3.jpg); }
a.active { background-image: url(img4.jpg); }
</style>

Better working with an alone image
(where the 3 main images are sticked side by side)
if not, user will have to wait the new image of the roll-over

a { background: url(button/jpg) no-repeat center center; }
a.visited { background-position: left center); }
a.hover { background-position: right center; }
a.active { background-image: none; background: red;}

<a href="#">
<img src="empty.gif" alt="menu 1">
</a>


'empty.gif' is a transparent image of 1 px
 
T

Thomas 'PointedEars' Lahn

Simon said:
I wish to duplicate text link behaviour with some button images.

That would be impossible as a (hypertext) link is not a button. But I think
I know what you really mean.
Hover is easy but other than saving cookies how can I know if the page
that the button liks to has been visited so that I can display a
different image?

With text links the link knows if it has been visited, so there is
something available in the browser that is keeping track of every page
visited.

The link knows nothing. The user agent is keeping track of the visited
sites through the browser's history, and the former's layout engine is
usually applying CSS on the hyperlink (whether it has textual content or not).
I guess we see it also in the website url pulldown and auto complete as
we are typing links.

Strange talk you do. "We" *don't* type links in a browser's location bar,
"we" type _URIs_. Besides, which browser are you talking about anyway?
Can I access this info with javascript?

I don't think so. However, you don't need scripting here, HTML and CSS suffice:

a.img {
display: block;
background-repeat: no-repeat;
}

a.img span {
visibility: hidden;
}

#img1 {
width: 42px;
height: 23px;
background-image: url(foo.png);
}

#img1:visited {
background-image: url(bar.png);
}

<a href="baz" class="img" id="img1"><span
class="hidden">alternative</span></a>

There is one drawback: The link will be empty if you disable images but not
stylesheets. But maybe someone in
comp.infosystems.www.authoring.stylesheets knows how to work around that.


HTH

PointedEars
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,744
Messages
2,569,483
Members
44,902
Latest member
Elena68X5

Latest Threads

Top