Hello,
The code I have pasted below is meant to display images on the middle 2 links without text and go back to text on the reset and fourth link. I have set display:none for the span tag only, but it does nothing. Is there anyway to do what I am after simply, without using a framework?
edit: example
<html>
<head>
<style type="text/css">
.class1{color:#000; background-image:url('1.jpg');}
.class1 span { display: none;}
.class2{color:#00f; background-image:url('2.jpg');}
.class2 span { display: none;}
.class3{color:#0f0; background-image:url('1.jpg');}
.class3 span { display: none;}
.class4{color:#f00;}
</style>
</head>
<body>
<script type="text/javascript">
function sbox(divid, classname)
{
document.getElementById(divid).className=classname;
}
</script>
<div>
<a href="#" onclick="sbox('div1','class1');return false;">Reset</a><br/>
<a href="#" onclick="sbox('div1','class2');return false;">try here</a><br/>
<a href="#" onclick="sbox('div1','class3'); return false;">or here</a><br/>
<a href="#" onclick="sbox('div1','class4');return false;">or maybe here</a>
</div>
<div id="div1" class="class4"><span id="div1_text">Blah blah blah</span></div>
</body>
</html>