seans said:
Hi Stephen thanks for your reply. Yes that is what I am trying to do.
The strings are encloses in span tags.
Is this the way to create styles programmatically in JavaScript? I
tried doing the following but it produced an error saying that there
were an invalid number of arguments.
document.createStyleSheet();
with (document.styleSheets(document.styleSheets.length-1)) {
addRule(".highlight","color:red;font-Size: 16pt;font-family:arial");
}
document.styleSheets isn't supported by Opera and is unnecessary.
I advised toggling the element's className.
Try this fragile example:
<HTML>
<HEAD>
<style>
..normText{color:black; font-weight:normal}
..redText{color:red; font-weight:bold}
</style>
</HEAD>
<BODY>
<FORM>
<SELECT name='s1' onchange='hiLite( "theText", this.selectedIndex-1 )'>
<option>Please select a word...
<option>Truth
<option>Indefinite
<option>Doubt
</SELECT>
</FORM>
<DIV id='theText' class='normText'>Any <span>truth</span> is better than <span>indefinite</span>
<span>doubt</span>.</DIV>
<SCRIPT type='text/javascript'>
function hiLite(elem, idx)
{
var spans=document.getElementById( elem ).getElementsByTagName('span');
for(var i=0,len=spans.length; i<len; i++)
spans
.className = (i==idx)? 'redText' : 'normText';
}
</SCRIPT>
</BODY>
</HTML>
