Page 1 of 1
alternating row colors with mouseover effect
Posted: Tue Feb 21, 2006 5:24 pm
by davidprogramer
Code: Select all
<?
$bg_color="#616161";
?>
<HTML><HEAD> <script LANGUAGE="JavaScript">
function TrowOn(src,OnColor)
{
src.style.cursor = 'hand'; src.bgColor = OnColor;
}
function TrowOff(src,OffColor)
{
src.style.cursor = 'default'; src.bgColor = OffColor;
}
</script>
</HEAD>
<BODY>
<table id="mainTable">
<tr onMouseOver="TrowOn(this,'#ffffcc');" onMouseOut="TrowOff(this, <? $bg_color ?> );">
<td>CELL 1</td> <td>CELL 2</td> <td>CELL 3</td>
</tr>
<tr onMouseOver="TrowOn(this,'#ffffcc');" onMouseOut="TrowOff(this,'#616161');">
<td>CELL 4/td> <td>CELL 5/td> <td>CELL 6/td>
</tr>
</table>
</body>
</html>
Ok. My problem is not alternating the colors. I really already know how to do that using modulus. My real problem is trying to get the variable "$bg_color" to work. If I use a straight up hex number it works fine. But if I use a variable that is pre-defined, it doesn't work. I have changed the second row to use a hex number in this example, and if you copy the code here, you will notice that it works. But the first row will not. Any ideas?
Posted: Tue Feb 21, 2006 5:27 pm
by feyd
prints nothing as you may have realized.
does.
Posted: Tue Feb 21, 2006 5:30 pm
by pickle
You need to put it in quotes.
A simpler (perhaps cleaner?) solution would be to just toggle the row's classname, then put all the style stuff in a CSS file:
Code: Select all
<html>
<body>
<table>
<tr onmouseover = "this.className='rowOn';" onmouseout = "this.className='rowOff';">
blah blah blah
Posted: Tue Feb 21, 2006 6:44 pm
by davidprogramer
feyd wrote:prints nothing as you may have realized.
does.
One prob. If I am already in php, how would I echo it?
i.e.
Code: Select all
echo "<tr onMouseOver="TrowOn(this,'#254961');" onMouseOut="TrowOff(this,'#616161');">";
echo "<tr onMouseOver="TrowOn(this,'#254961');" onMouseOut="TrowOff(this, "$bg_color");">
And pickle. I cant use a css file because the bg color is dynamic in my situation. The previous code is just examples of what I am trying to do so it is a little more readable.
Code: Select all
function row_color($p){
if ($p % 2){
$bg_color="#7B7B7B";
}else{
$bg_color="#626262";
}
return $bg_color;
}
Posted: Tue Feb 21, 2006 8:02 pm
by d3ad1ysp0rk
davidprogramer wrote:And pickle. I cant use a css file because the bg color is dynamic in my situation. The previous code is just examples of what I am trying to do so it is a little more readable.
Actually, that's the point..
Code: Select all
<style type="text/css">
.rowOn {background-color: #7B7B7B}
.rowOff {background-color: ##626262)
</style>
Posted: Tue Feb 21, 2006 8:05 pm
by davidprogramer
I don't think I understand. The code is inside a for loop. Here let me show you.
Code: Select all
for ($i=$cl_start; $i < $cl_start + 20; $i++)
{
$bg_color = row_color($i);
echo "<tr onMouseOver=\"TrowOn(this,'#254961');\" onMouseOut=\"TrowOff(this, ".$bg_color.");\">
<td nowrap><center>  $i</td></center>
<td nowrap><center>  <A HREF=\"javascript:popUpClan('modules.php?name=League&file=clan_view&lid=$current_ladder&cid=$clan_id')\">$clan_tag</a></td>
<td nowrap><center>  $clan_points</td></center>
<td nowrap><center>  $clan_strength</td></center>
<td nowrap><center>  $clan_honor</td></center>
<td nowrap><center>  $clan_wins - $clan_losses</td></center>
<td nowrap><center>  $clan_winpercent<b></b>%</td></center>
<td nowrap><center>  $clan_streak</td></center>
</tr>";
}
Code: Select all
function row_color($p){
if ($p % 2){
$bg_color="#7B7B7B";
}else{
$bg_color="#626262";
}
return $bg_color;
}
Posted: Tue Feb 21, 2006 8:21 pm
by ssand
You need some single quotes before your double quotes.
Code: Select all
so... TrowOff(this, '".$bg_color."');\">
edit: actually i was working from your original code... as feyd posted (then it would work):
Code: Select all
onMouseOut="TrowOff(this, '<?php echo $bg_color; ?>' );">
Posted: Tue Feb 21, 2006 8:27 pm
by davidprogramer
ssand that worked perfect! Thank-you everyone!
If anyone wants to check it out go
here
Posted: Wed Feb 22, 2006 2:47 am
by onion2k
Please stop using short tags.
