[SOLVED] quick question

[paulman888888]

When the mouse goes over the tablerow how do i change the background colour useing css.

i got this so far

.tabletype1{
background:#00FF00;
}

 

Thankyou for all the help

[nova912]

I think this can only be accomplished through javascript as a <tr> does not respond to the ":hover" pseudo selector in most browsers.

[paulman888888]

ok so how can i do it it javascript

thankyou

[discomatt]

Google

[thebadbad]

Wrong forum mate, but I will give you a short answer nonetheless Using CSS, this will only work in browsers supporting the :hover pseudo-class on most elements (and not only on the anchor element as many browsers do):

 

.tabletype1 {
background-color: #00FF00;
}

.tabletype1:hover {
/* red background when mouse 'hovers' above the element */
background-color: red;
}

 

The other solution would be changing the style with javascript's "onmouseover" trigger.

[paulman888888]

i cant do it

onmouseover

please can someone make an example please.

 

[thebadbad]

Sure

 

<tr onmouseover="this.style.backgroundColor = '#00FF00';" onmouseout="this.style.backgroundColor = 'transparent';"><td><p>Cell content.</p></td></tr>

[paulman888888]

i have had ago but i get no luck.

I think its because i use mysql as well.

anyway heres my code

<?php
$result = mysql_query("SELECT * FROM downloads ORDER BY id ASC"); 
$i = 0; // setup a counter
echo '<table border="1" width="550">';
echo "<tr><th>ID</th><th>Name</th><th>Download Location</th><th>Size</th><th>Download</th></tr>";
while($row = mysql_fetch_array( $result ))
{
    // alternate class
    $class = ($i%2 == 0) ? '#00FF00' : '#FF0000';
$class2 = ($i%2 == 0) ? '#FFFF00' : '#316AC5';

// Print out the contents of each row into a table
echo '<tr onmouseover="this.style.backgroundColor = "'$class'";" onmouseout="this.style.backgroundColor = "'$class2'";">';
echo "<td><a href='info.php?id=".$row['id']."'>".$row['id']."</a></td>\n";
echo "<td>".$row['name']."</td>";
echo "<td>".$row['location']."</td>";
echo "<td>".$row['Size']."</td>";
echo '<td><center><a href="'.$row['location'].'"><img src="Images/downloadsm.png" /></a></center></td>';
echo "</tr>";
    $i++; // increment counter
}

echo "</table>";

?>

 

And i keep getting errors.

 

Thankyou everyone

[thebadbad]

You're messing up the single and double quotes. Let me fix it kindly

 

<?php
$result = mysql_query("SELECT * FROM downloads ORDER BY id ASC"); 
$i = 0; // setup a counter
echo '<table border="1" width="550">';
echo "<tr><th>ID</th><th>Name</th><th>Download Location</th><th>Size</th><th>Download</th></tr>";
while($row = mysql_fetch_array( $result ))
{
    // alternate class
    $class = ($i%2 == 0) ? '#00FF00' : '#FF0000';
$class2 = ($i%2 == 0) ? '#FFFF00' : '#316AC5';

// Print out the contents of each row into a table
echo "<tr onmouseover=\"this.style.backgroundColor = '".$class."';\" onmouseout=\"this.style.backgroundColor = '".$class2."';\">";
echo '<td><a href=\"info.php?id='.$row['id'].'">'.$row['id']."</a></td>\n";
echo "<td>".$row['name']."</td>";
echo "<td>".$row['location']."</td>";
echo "<td>".$row['Size']."</td>";
echo '<td><center><a href="'.$row['location'].'"><img src="Images/downloadsm.png" /></a></center></td>';
echo "</tr>";
    $i++; // increment counter
}

echo "</table>";

?>

 

Just to make it clear, $class is the color the row gets when moused over, and $class2 is the color the row gets when the mouse clears the row again. If you want the color to return to the background color of the element beneath it, use "transparent" as the color for $class2.

[paulman888888]

thankyou