Entry
How to make a text bold onmouseover?
May 4th, 2000 05:40
Martin Honnen,
With NN4 you need to absolutely position your element to achieve that,
NN6 and IE4+ can change the style on every element:
<HTML>
<HEAD>
<STYLE>
#aLayer { position: absolute; }
</STYLE>
<SCRIPT>
function highlight (id, yes, content) {
if (yes) {
if (document.all)
document.all[id].style.fontWeight = 'bold';
else if (document.getElementById)
document.getElementById(id).style.fontWeight = 'bold';
else if (document.layers) {
var ld = document[id].document;
ld.open();
ld.write('<B>' + content + '<\/B>');
ld.close();
}
}
else {
if (document.all)
document.all[id].style.fontWeight = 'normal';
else if (document.getElementById)
document.getElementById(id).style.fontWeight = 'normal';
else if (document.layers) {
var ld = document[id].document;
ld.open();
ld.write(content);
ld.close();
}
}
}
function initEventHandling () {
if (document.layers) {
document.aLayer.onmouseover =
function () { highlight (this.id, true, 'Kibology for all.'); };
document.aLayer.onmouseout =
function () { highlight (this.id, false, 'Kibology for all.'); };
}
}
</SCRIPT>
</HEAD>
<BODY ONLOAD="initEventHandling();">
<DIV ID="aLayer"
ONMOUSEOVER="highlight(this.id, true)"
ONMOUSEOUT="highlight(this.id, false)"
>
Kibology for all.
</DIV>
</BODY>
</HTML>
See also
http://www.faqts.com/knowledge-base/view.phtml/aid/1619/fid/128/lang/en
for a more sophisticated solution.