Onclick Change Link State to bold

by Hiroshi on 06-10-2007

If you need to change the state of link onclick event t blod in navigation then we will use following code.

<html>
<head>
<title>Change Links State On Click</title>
<style type="text/css">
.activate { font-weight: bold; }
</style>
</head>
<body>
<a href="#" id="link1" onclick="changeActiveStates(this)">Link A</a>
<a href="#" id="link2" onclick="changeActiveStates(this)">Link B</a>
<a href="#" id="link3" onclick="changeActiveStates(this)">Link C</a>
<script type="text/javascript">
function byId(id) {
return document.getElementById ? document.getElementById(id) : document.all[id];
}
var prevLink = "";
function changeActiveStates(ele) {
if (prevLink) byId(prevLink).className = "";
ele.className = 'activate';
prevLink = ele.id;
}
</script>
</body>
</html>

This will cause the link to appear bold when clicked and when you click another link then previous clicked link will be normal and active link will be bold.

Simple ;)

  • Share/Save/Bookmark

Stumble it Digg it Bookmark it Tweet it Share at Facebook

Related Posts

Post a Comment

Comment will appear here after approval, Thanks for patience