PDA

View Full Version : How to override A:visited



ta158897
06-11-2008, 01:11 AM
Hi,

I am new to CSS. My website -it is about online training. Suppose there are 3 chapters. Each chapter has 10 units and there is a link for each unit. The homepage will contain all 10 links one chapter at a time. (This is parameterized).

While chapter-1 is getting discussed, all the links gets visited status. Now when chapter-2 starts - all the links are already in visited status. But in reality users have not started visiting any unit.

How can I reset visited status as new chapter starts?

Thanks

rangana
06-11-2008, 02:02 AM
Ensure that the hierarchy of the pseudo elements are arranged as in LoVe HAte.

As in:


a:link{}
a:visited{}
a:hover{}
a:active{}


If nothing works, up the code.

ta158897
06-11-2008, 03:42 PM
Hi

There is nothing wrong with the code. Heirarchy is OK. But there are times when I want to reset the link to ("non-visited") even though they are visited.

Is there any way to do it?

Thanks

ta158897
06-11-2008, 03:54 PM
Hi

I am not sure if the question is OK for this forum.

In my website, there is a situation when I want to reset the "visited" links back to original state - as if they were not visited.

How can I do that?

Thanks

Medyman
06-11-2008, 04:28 PM
The only way (that I know of) to do it is to clear the user's history. I don't recommend or condone doing that, but nonetheless it is an option.

Medyman
06-11-2008, 04:33 PM
Please don't double post. Your question was answered in the other thread.

boogyman
06-11-2008, 06:13 PM
The only way (that I know of) to do it is to clear the user's history. I don't recommend or condone doing that, but nonetheless it is an option.

which you cannot do with Javascript alone.

There is a way to accomplish what you would like, however it would disable all the default "color" styles for the anchor elements you apply it to.

What you would do is create a style that applies to all anchor tags within an specific element.



<p class="ddlink"><a href="/path">LINK</a></p>




p.ddlink a:link, p.ddlink a:visited {
color: #0000ff;
}


the above would keep the color of the anchor text blue whether they visited that link or not.

now saying that, its generally not good coding practice to break the conventions of the web.

rangana
06-12-2008, 01:01 AM
I made a response about this in the other thread, and was convinced you might need some JS to force the color. You might find this code useful:


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<style type="text/css">
#nav a {
color:#000;
text-decoration:none;
}
ul
{
list-style-type:none;
font-family:Tahoma;
font-size:10pt;

}
</style>

<script type="text/javascript">
window.onload=function()
{
var accept=document.getElementById('nav').getElementsByTagName('a');
for(var i=0;i<accept.length;i++)
{
accept[i].onclick=function()
{
for(var i=0;i<accept.length;i++)
{
accept[i].style.color='#222';
{
this.style.color='#f00';
}
}
}
}
}
</script>

</head>
<body>

<ul id="nav">
<li><a href="#">link one</a></li>
<li><a href="#">link two</a></li>
<li><a href="#">link three</a></li>
<li><a href="#">link four</a></li>
<li><a href="#">link five</a></li>
</ul>

</body>
</html>


Hope it helps.

magicyte
06-23-2008, 05:08 PM
I have a special way of actually forbidding per se fake links to become visited (turning purple). These things that I make are not actually links. They are spans that act as special links. I will leave the code for you to see:



<html>
<head>
<title>
Fake Links
</title>
<script language="JavaScript">
function red(obj)
{
obj.style.color="red";
}

function blue(obj)
{
obj.style.color="blue";
}

function transport(obj)
{
window.location.href=obj;
}
</script>
</head>
<body>
<span style="font-family:Arial;color:blue;cursor:hand;" onmouseover="red(this)" onmouseout="blue(this)" onclick="transport('http://www.dynamicdrive.com/')">
Dynamic Drive
</span>
</body>
</html>


Hope it helps with something, though considering that every other user posted some VERY USEFUL scripts, you probably won't need it. Just saying...

rangana
06-24-2008, 12:42 AM
Hi magicyte,

Your solution only shows that there are number of ways to skin a cat, but one thing I would like to point out:


<script language="JavaScript">


Highlighted is deprecated which is replaceable by:


type="text/javascript"

magicyte
06-24-2008, 05:47 PM
Yes. Quite and yet partially NOT true in the following quote:

Hi magicyte,

Your solution only shows that there are number of ways to skin a cat, but one thing I would like to point out:


<script language="JavaScript">


Highlighted is deprecated which is replaceable by:


type="text/javascript"


You are to only replace "JavaScript" with "text/javascript" only when using other languages as well including AJAX. Just wanted to point that out.

-magicyte