MouseOver <TR> Highlight BUG?

1 view
Skip to first unread message

Ferris

unread,
Feb 21, 2002, 12:57:59 PM2/21/02
to
(Note: this message has also been posted to ...devs-javascript.)

Hello,

Has anyone confirmed whether this is a bug or not? I have not seen ANYONE
get this behavior to work right in NS6. To see what I'm talking about,
please copy and paste the following code and view it in IE (5.5 and above, I
think) and then copy the code and view it in NS6.

I'm trying to get the mouseover highlight to work from within the <TR> so
that the whole row is highlighted and not just the individual cells. One of
the more distinguished contributors on the other NG gave me some good
ideas, but they have not completely fixed the problem. As it functions now,
the highlighting "sticks" at random rows. It works like a champ in IE, but
in NS6 the mouseout event is not firing the
"cOff" function properly. If someone can get this working I think it will be
a precedent setter because I have been looking for weeks for this on the web
(of course it could still be under the ONE stone I didn't turn.) all to no
avail.

Thank you for your time.

Ferris


<html><head><title>Wisdom Stories</title><meta http-equiv=Content-Type
content="text/html; charset=iso-8859-1">

<script language="JavaScript">
<!--
function
reloadPage(init) { //reloads the window if Nav4 resized
if (init==true) with (navigator) {if
((appName=="Netscape")&&(parseInt(appVersion)==4)) {
document.
pgW=innerWidth; document.
pgH=innerHeight; onresize=
reloadPage; }}
else if (innerWidth!=document.
pgW || innerHeight!=document.
pgH) location.reload();
}

reloadPage(true);
// -->
</script>


<SCRIPT LANGUAGE="JavaScript">
document.oncontextmenu = function(){return false}
if(document.layers) {
window.captureEvents(Event.MOUSEDOWN);
window.onmousedown = function(e){
if(e.target==document)return false;
}
}
else {
document.onmousedown = function(){return false}
}
</SCRIPT>
<!--code to refresh cache and reset themes boxes-->
<script language="javascript">
if (document.cookie) {
if (document.cookie == 0) {
document.cookie = 1;
window.location.reload();
} else {
document.cookie = 0;
}
} else {
document.cookie = 1;
window.location.reload();
}
</script>

<script type="text/javascript">
<!--

if (window.Node && Node.prototype && !Node.prototype.contains)
Node.prototype.contains = function (nodeToCheck) {
while (nodeToCheck) {
if (this == nodeToCheck)
return true;
nodeToCheck = nodeToCheck.parentNode;
}
return false;
};
function sH (elementId) {
if (document.all)
document.all[elementId].style.visibility = 'visible';
else if (document.getElementById)
document.getElementById(elementId).style.visibility = 'visible';
}

function hI (elementId) {
if (document.all)
document.all[elementId].style.visibility = 'hidden';
else if (document.getElementById)
document.getElementById(elementId).style.visibility = 'hidden';
}

function mIn (element, evt) {
if (evt.relatedTarget)
return !element.contains(evt.relatedTarget);
else if (evt.fromElement)
return !element.contains(evt.fromElement);
}
function mOut (element, evt) {
if (evt.relatedTarget)
return !element.contains(evt.relatedTarget);
else if (evt.toElement)
return !element.contains(evt.toElement);
}
function jmp(targ,selObj,restore)

{
eval(targ+".location='"+selObj.options[selObj.selectedIndex].value+"'");
if(restore)selObj.selectedIndex=0;
}
//-->
</script>

<script language="javascript">

function cOn(tr){
if(document.getElementById||(document.all && !(document.getElementById))){
tr.style.backgroundColor="#FFFFCC";
}
}

function cOff(tr){
if(document.getElementById||(document.all && !(document.getElementById))){
tr.style.backgroundColor="#CCCCCC";
}
}

//-->
</script>

<style
type="text/css"><!--a{color:#000000;text-decoration:none;cursor:default;font
-size:13px;white-space:nowrap}.b{text-decoration:none;visibility:hidden;font
-size:9px}td{font-size:12px;cursor:default;line-height:18px;height:13px;clip
:rect();white-space:nowrap;font-weight:bold}select{font-size:9px;visibility:
hidden;clip:rect()}div{}--></style></head><body onload=top.window.focus()
bgcolor=#000000 text=#000000 SPACING=0 marginheight=0 marginwidth=0
topmargin=0 leftmargin=0>


<!--SUSPECT CODE STARTS
HERE-->

<table cellspacing=0 cellpadding=0 bordercolor=#666666 border=2 width=100%
height=34 bgcolor=#CCCCCC>
<tr onMouseOver="if (mIn(this,event)) cOn(this);" onMouseOut="if
(mOut(this, event)) cOff(this);">
<td width=4%><div align=center><b>1</b></div></td>
<td width=76% onMouseOver="sH('c1')" ONMOUSEOUT="hI('c1')"
ONCLICK="location.href = 'A1/2.PDF'"><div>SELECTION</div></td>
<form><td onMouseOver="if (mIn(this, event))sH('c1')" onMouseOut="if
(mOut(this, event))hI('c1')" width=18%><select
id="c1"onChange=jmp('parent.frames[\'mainFrame\']',this,0)><option
selected>---OPTION SELECTED---</option><option
value=81.HTM>OPTION</option><option value=99.HTM>OPTION</option><option
value=153.HTM>OPTION</option><option
value=172.HTM>OPTION</option></select></td></form></tr>

<tr onMouseOver="if (mIn(this,event)) cOn(this);" onMouseOut="if
(mOut(this, event)) cOff(this);">
<td width=4%><div align=center><b>1</b></div></td>
<td width=76% onMouseOver="sH('c2')" ONMOUSEOUT="hI('c2')"
ONCLICK="location.href = 'A1/2.PDF'"><div>SELECTION</div></td>
<form><td onMouseOver="if (mIn(this, event))sH('c2')" onMouseOut="if
(mOut(this, event))hI('c2')" width=18%><select
id="c2"onChange=jmp('parent.frames[\'mainFrame\']',this,0)><option
selected>---OPTION SELECTED---</option><option
value=81.HTM>OPTION</option><option value=99.HTM>OPTION</option><option
value=153.HTM>OPTION</option><option
value=172.HTM>OPTION</option></select></td></form></tr>

<tr onMouseOver="if (mIn(this,event)) cOn(this);" onMouseOut="if
(mOut(this, event)) cOff(this);">
<td width=4%><div align=center><b>1</b></div></td>
<td width=76% onMouseOver="sH('c3')" ONMOUSEOUT="hI('c3')"
ONCLICK="location.href = 'A1/2.PDF'"><div>SELECTION</div></td>
<form><td onMouseOver="if (mIn(this, event))sH('c3')" onMouseOut="if
(mOut(this, event))hI('c3')" width=18%><select
id="c3"onChange=jmp('parent.frames[\'mainFrame\']',this,0)><option
selected>---OPTION SELECTED---</option><option
value=81.HTM>OPTION</option><option value=99.HTM>OPTION</option><option
value=153.HTM>OPTION</option><option
value=172.HTM>OPTION</option></select></td></form></tr>

<tr onMouseOver="if (mIn(this,event)) cOn(this);" onMouseOut="if
(mOut(this, event)) cOff(this);">
<td width=4%><div align=center><b>1</b></div></td>
<td width=76% onMouseOver="sH('c4')" ONMOUSEOUT="hI('c4')"
ONCLICK="location.href = 'A1/2.PDF'"><div>SELECTION</div></td>
<form><td onMouseOver="if (mIn(this, event))sH('c4')" onMouseOut="if
(mOut(this, event))hI('c4')" width=18%><select
id="c4"onChange=jmp('parent.frames[\'mainFrame\']',this,0)><option
selected>---OPTION SELECTED---</option><option
value=81.HTM>OPTION</option><option value=99.HTM>OPTION</option><option
value=153.HTM>OPTION</option><option
value=172.HTM>OPTION</option></select></td></form></tr>

<tr onMouseOver="if (mIn(this,event)) cOn(this);" onMouseOut="if
(mOut(this, event)) cOff(this);">
<td width=4%><div align=center><b>1</b></div></td>
<td width=76% onMouseOver="sH('c5')" ONMOUSEOUT="hI('c5')"
ONCLICK="location.href = 'A1/2.PDF'"><div>SELECTION</div></td>
<form><td onMouseOver="if (mIn(this, event))sH('c5')" onMouseOut="if
(mOut(this, event))hI('c5')" width=18%><select
id="c5"onChange=jmp('parent.frames[\'mainFrame\']',this,0)><option
selected>---OPTION SELECTED---</option><option
value=81.HTM>OPTION</option><option value=99.HTM>OPTION</option><option
value=153.HTM>OPTION</option><option
value=172.HTM>OPTION</option></select></td></form></tr>

<tr onMouseOver="if (mIn(this,event)) cOn(this);" onMouseOut="if
(mOut(this, event)) cOff(this);">
<td width=4%><div align=center><b>1</b></div></td>
<td width=76% onMouseOver="sH('c6')" ONMOUSEOUT="hI('c6')"
ONCLICK="location.href = 'A1/2.PDF'"><div>SELECTION</div></td>
<form><td onMouseOver="if (mIn(this, event))sH('c6')" onMouseOut="if
(mOut(this, event))hI('c6')" width=18%><select
id="c6"onChange=jmp('parent.frames[\'mainFrame\']',this,0)><option
selected>---OPTION SELECTED---</option><option
value=81.HTM>OPTION</option><option value=99.HTM>OPTION</option><option
value=153.HTM>OPTION</option><option
value=172.HTM>OPTION</option></select></td></form></tr>

<tr onMouseOver="if (mIn(this,event)) cOn(this);" onMouseOut="if
(mOut(this, event)) cOff(this);">
<td width=4%><div align=center><b>1</b></div></td>
<td width=76% onMouseOver="sH('c7')" ONMOUSEOUT="hI('c7')"
ONCLICK="location.href = 'A1/2.PDF'"><div>SELECTION</div></td>
<form><td onMouseOver="if (mIn(this, event))sH('c7')" onMouseOut="if
(mOut(this, event))hI('c7')" width=18%><select
id="c7"onChange=jmp('parent.frames[\'mainFrame\']',this,0)><option
selected>---OPTION SELECTED---</option><option
value=81.HTM>OPTION</option><option value=99.HTM>OPTION</option><option
value=153.HTM>OPTION</option><option
value=172.HTM>OPTION</option></select></td></form></tr>

<tr onMouseOver="if (mIn(this,event)) cOn(this);" onMouseOut="if
(mOut(this, event)) cOff(this);">
<td width=4%><div align=center><b>1</b></div></td>
<td width=76% onMouseOver="sH('c8')" ONMOUSEOUT="hI('c8')"
ONCLICK="location.href = 'A1/2.PDF'"><div>SELECTION</div></td>
<form><td onMouseOver="if (mIn(this, event))sH('c8')" onMouseOut="if
(mOut(this, event))hI('c8')" width=18%><select
id="c8"onChange=jmp('parent.frames[\'mainFrame\']',this,0)><option
selected>---OPTION SELECTED---</option><option
value=81.HTM>OPTION</option><option value=99.HTM>OPTION</option><option
value=153.HTM>OPTION</option><option
value=172.HTM>OPTION</option></select></td></form></tr>
</table>

</body></html>


Reply all
Reply to author
Forward
0 new messages