PDA

View Full Version : Resolved Having Link Style Default to Active Before Being Clicked On



Abbster22
10-22-2010, 03:08 AM
What I'm trying to do is to do something similar to what this person wanted on their question:
http://www.webmasterworld.com/javascript/3338586.htm

Instead, what I'm looking for is a way to have the links change whenever they're clicked, but to have one of the links already have the active class (which is the effect the links will have when the user clicks on it) and then have the same effect happen thereafter.

Here is the Javascript:


<script type="text/javascript">
var hrefs=document.getElementsByTagName("a");
var hrefs=document.getElementsByClassName("links");
var preA="";
for(var i=0;i<hrefs.length;i++){
hrefs[i].onclick=function(){
if(preA!="" && preA!=this){
preA.className="links";
}
this.className="active";
preA=this;
}
}
</script>


Here is the CSS:


a.links:link {
color: #FFF;
text-decoration: none;
}
a.links:hover {
color: #96C;
text-decoration: none;
}
a.active {
color: #96C;
text-decoration: none;
}


Here is the HTML:


<a class="links" href="#">Curriculum Vitae</a> | <a class="links" href="#">Teaching Philosophy</a> | <a class="links" href="#">Artist Statement</a>


I figured out the answer to my problem. You can view the source code to solving my problem on the page:
http://gds.parkland.edu/student/fall10/gds220/ashipley/p2/final/aboutbryan.html