mouse over - background color

[Zeroanarchy]

ok is it possible using this code to do the following, I am trying to make it so that when you mouse over one of the columns it will change the color of all of them.

At present it only highlights the column you mouse over but I am trying to make it highlight all the columns.

eg. if you mouse over column 2 it will change the background color of columns 2, 3, 4, 5

if you mouse over 3 it changes 3, 2, 4, 5
if you mouse over 4 it changes 4, 2, 3, 5
if you mouse over 5 it changes 5, 2, 3, 4

<!----Column 2 starts here----->
<td bgcolor=&quot;$iB::SKIN->{'FORUM_COL_TWO'}&quot; align=&quot;left&quot; width='45%'><span id=&quot;linkthru&quot;><b><a href=&quot;$iB::INFO->{'BOARD_URL'}/ikonboard.$iB::INFO->{'CGI_EXT'}?s=$iB::SESSION;act=SF;f=$Data->{'FORUM_ID'}&quot;>$Data->{'FORUM_NAME'}</a></b></span>
$Data->{'FORUM_DESC'}<span id='highlight'>
$Data->{'MODERATOR'}</span>
$Boards::lang->{'forum_users'} : $Data->{'FORUM_USERS'}</td>

<!----Column 3 starts here----->
<td bgcolor=&quot;<%SKIN:FORUM_COL_THREE%>&quot; align='center' valign='middle' width='10%'>$Data->{'FORUM_TOPICS'}
</td>

<!----Column 4 starts here----->
<td bgcolor=&quot;<%SKIN:FORUM_COL_FOUR%>&quot; align='center' valign='middle' width='10%' id='highlight'>$Data->{'FORUM_POSTS'}
</td>

<!----Column 5 starts here----->
<td bgcolor=&quot;<%SKIN:FORUM_COL_FIVE%>&quot; align=&quot;left&quot; valign='middle' width='35%'><span id='highlight'>$Data->{'FORUM_LAST_POST'}</span><br><%LANG:Boards:in%>: $Data->{'N_LINK'}<br><%LANG:Boards:by%>: $Data->{'P_LINK'}</td>
</tr>

I have got it to the stage for column2 that on mouse over it will light up Column 2 but I am trying to get it to light up all the columns

<!-------- New Column 2-------->

<td style=&quot;Cursor:Hand&quot; onClick=&quot;window.location.href='<%VAR:BOARD_URL%>/ikonboard.<%VAR:CGI_EXT%>?s=$iB::SESSION;act=SF;f=$Data->{'FORUM_ID'}'&quot;
onMouseOver=&quot;this.style.backgroundColor='#6699cc'&quot; onMouseOut=&quot;this.style.backgroundColor='<%SKIN:FORUM_COL_TWO%>'&quot; bgcolor=&quot;<%SKIN:FORUM_COL_TWO%>&quot; align=&quot;left&quot; width='45%'><span id=&quot;linkthru&quot;><b><a href=&quot;<%VAR:BOARD_URL%>/ikonboard.<%VAR:CGI_EXT%>?s=$iB::SESSION;act=SF;f=$Data->{'FORUM_ID'}&quot;>$Data->{'FORUM_NAME'}</a></b></span><br>
$Data->{'FORUM_DESC'}<br>
<span id='highlight'>$Data->{'MODERATOR'}</span><br>
<%LANG:Boards:forum_users%>: $Data->{'FORUM_USERS'}</td>

I have also got it sorted for Column 5 as well

<td style=&quot;Cursor:Hand&quot; onClick=&quot;window.location.href='<%VAR:BOARD_URL%>/ikonboard.<%VAR:CGI_EXT%>?s=$iB::SESSION;act=SF;f=$Data->{'FORUM_ID'}'&quot;
onMouseOver=&quot;this.style.backgroundColor='#6699cc'&quot; onMouseOut=&quot;this.style.backgroundColor='<%SKIN:FORUM_COL_Five%>'&quot; bgcolor=&quot;<%SKIN:FORUM_COL_FIVE%>&quot; align=&quot;left&quot; valign='middle' width='45%'><span id='highlight'>$Data->{'FORUM_LAST_POST'}</span><br><%LANG:Boards:in%>: $Data->{'N_LINK'}<br><%LANG:Boards:by%>: $Data->{'P_LINK'}</a></b></span></td>

I understand that this part of the line need to change

onMouseOver="this.style.backgroundColor='#6699cc'"

but how can you refer it to more than one column??

Thanks for your time

ZeroAnarchy
Experience is a wonderful thing. It enables you to recognize a mistake
when you make it again.

 

[Zeroanarchy]

i have been playing around and was hoping if someone may be able to help finish it off.

    <!-- Forum $Data->{'FORUM_ID'} entry -->
<table>
<tr>

<!--department 1-->
<div id=&quot;dept_a&quot;>
<td 
onMouseOver=&quot;'dept_a';'dept_b';dept_c';'dept_d';dept_e';.backgroudcolor='#6699cc'&quot; 
onMouseOut= &quot;'dept_a';'dept_b';dept_c';'dept_d';dept_e';.backgroudcolor='#000000'&quot;
 bgcolor='#000000' align=&quot;center&quot; width=&quot;5%&quot;>$Data->{'NEW_POST_IMG'}
</td>

<!--department 2-->
<div id=&quot;dept_b&quot;>
<td style=&quot;Cursor:Hand&quot; onClick=&quot;window.location.href='<%VAR:BOARD_URL%>/ikonboard.<%VAR:CGI_EXT%>?s=$iB::SESSION;act=SF;f=$Data->{'FORUM_ID'}'&quot;
onMouseOver=&quot;'dept_a';'dept_b';dept_c';'dept_d';dept_e';.backgroudcolor='#6699cc'&quot; 
onMouseOut= &quot;'dept_a';'dept_b';dept_c';'dept_d';dept_e';.backgroudcolor='#000000'&quot;
bgcolor='#000000' align=&quot;left&quot; width='45%'><span id=&quot;linkthru&quot;><b>
<a href=&quot;<%VAR:BOARD_URL%>/ikonboard.<%VAR:CGI_EXT%>?s=$iB::SESSION;act=SF;f=$Data->{'FORUM_ID'}&quot;>$Data->{'FORUM_NAME'}</a></b></span><br>
$Data->{'FORUM_DESC'}<br>
<span id='highlight'>
$Data->{'MODERATOR'}</span><br>
<%LANG:Boards:forum_users%> : $Data->{'FORUM_USERS'}
</td>

<!--department 3-->
<div id=&quot;dept_c&quot;>
<td 
onMouseOver=&quot;'dept_a';'dept_b';dept_c';'dept_d';dept_e';.backgroudcolor='#6699cc'&quot; 
onMouseOut= &quot;'dept_a';'dept_b';dept_c';'dept_d';dept_e';.backgroudcolor='#000000'&quot;
bgcolor='#000000' align='center' valign='middle' width='10%'>$Data->{'FORUM_TOPICS'}
</td>

<!--department 4-->
<div id=&quot;dept_d&quot;>
<td    
onMouseOver=&quot;'dept_a';'dept_b';dept_c';'dept_d';dept_e';.backgroudcolor='#6699cc'&quot; 
onMouseOut= &quot;'dept_a';'dept_b';dept_c';'dept_d';dept_e';.backgroudcolor='#000000'&quot;
bgcolor='#000000' align='center' valign='middle' width='10%' id='highlight'>$Data->{'FORUM_POSTS'}
</td>

<!--department 5-->
<div id=&quot;dept_e&quot;>
<td style=&quot;Cursor:Hand&quot; onClick=&quot;window.location.href='<%VAR:BOARD_URL%>/ikonboard.<%VAR:CGI_EXT%>?s=$iB::SESSION;act=SF;f=$Data->{'FORUM_ID'}'&quot;
onMouseOver=&quot;'dept_a';'dept_b';dept_c';'dept_d';dept_e';.backgroudcolor='#6699cc'&quot; 
onMouseOut= &quot;'dept_a';'dept_b';dept_c';'dept_d';dept_e';.backgroudcolor='#000000'&quot;
bgcolor='#000000' align=&quot;left&quot; valign='middle' width='45%'><span id='highlight'>$Data->{'FORUM_LAST_POST'}
</span><br><%LANG:Boards:in%>: $Data->{'N_LINK'}<br><%LANG:Boards:by%>: $Data->{'P_LINK'}</a></b></span>
</td>
</tr>

    <!-- End of Forum $Data->{'FORUM_ID'} entry -->

Cheers

ZeroAnarchy
Experience is a wonderful thing. It enables you to recognize a mistake
when you make it again.

 

[ecobb]

I'm not sure if this is what you're looking for, but this will change the bg color of the entire row of whatever column you mouse over:

<script language=&quot;JavaScript&quot;>
function changeBG(objRow, mouseState)
{
if (mouseState == 'on')
{
sColor = '#f5f5f5';
tColor = '#000000';
}
else if (mouseState == 'off')
{
sColor = '#FFFFFF';
tColor = '#000000';
}
objRow.bgColor = sColor;
objRow.style.color = tColor;
}
</script>


And you use this for your table row tag:


<tr onMouseOver=&quot;changeBG(this, 'on');&quot; onMouseOut=&quot;changeBG(this, 'off');&quot;>


Hope this helps.