Page is a not externally linkable
moonbiter - 1:47 pm on Aug 5, 2002 (gmt 0)
Dang, I banged my head against this for like a half hour and didn't think of that. Nice call, DrDoc! <edited> Also note that quotes in CSS URIs are optional. Furthermore, it won't work in Mozilla or Opera because you declare the li markers on the anchor tags, and this just won't work. AFAIK, there is no way to tell another part of a document if a certain link has been visited or not through javascript ... which was why I was banging my head against it in the first place. Still, the a:visited approach above works in IE, which is closer to the goal than any of my attempts got. For the record, this is as far as I got when I worked on it: </edited>
[snip good DrDoc example of mouseover]
Except now that I look at it, it won't work, because there are some syntax problems: <script type="text/javascript">
function imgswp(which) {
if (document.all) {
document.all[which].[b]style.listStyleImage = "url('path_to_img/old.gif')"[/b];
} else if (document.getElementById) {
document.getElementById(which).[b]style.listStyleImage = "url('path_to_img/old.gif')"[/b];
}
}
</script><html>
<head>
<title></title>
<style type="text/css">
body {
background: white;
color: black;
font: 12px Verdana, sans-serif;
}
a:hover {
color: red;
text-decoration: none;
}
li {
list-style-image: url(blue.gif);
}
</style>
<script type="text/javascript">
var bullet = new Array('red.gif', 'green.gif', 'blue.gif')
function init() {
var liNodeList = document.getElementsByTagName('li');
for (i = 0; i < liNodeList.length; i++) {
liNodeList[i].style.listStyleImage = 'url(' + bullet[2] + ')';
for (j = 0; j < liNodeList[i].childNodes.length; j++) {
if (liNodeList[i].childNodes[j].nodeName == 'A') {
liNodeList[i].childNodes[j].onclick = bulletClick;
liNodeList[i].childNodes[j].onmouseover = bulletOver;
liNodeList[i].childNodes[j].onmouseout = bulletOut;
}
}
}
}
function bulletClick() {
this.parentNode.style.listStyleImage = 'url(' + bullet[0] + ')';
}
function bulletOver() {
this.parentNode.style.listStyleImage = 'url(' + bullet[1] + ')';
}
function bulletOut() {
this.parentNode.style.listStyleImage = 'url(' + bullet[2] + ')';
}
</script>
</head><body onload="init();">
<ul>
<li>List item <a href="foobar.htm">foobar link</a></li>
<li>List item <a href="foobar.htm">foobar link</a></li>
<li>List item <a href="foobar.htm">foobar link</a></li>
<li>List item <a href="foobar.htm">foobar link</a></li>
</ul>
</body>
</html>