I have this table. I want to change the color of a cell, from black to red, when i move over that cell, I'm using the .hover method, and i'm having trouble figuring out how to make work accordingly to what i need.
<html>
<head>
<script type="text/javascript" src="jquery-1.4.js"></script>
<script>
$board = $('#board')
$(this).hover(function() {
$('td').css('border-color', 'red');
开发者_如何学编程 },
function() {
$('td').css('border-color', 'black')
})
</script>
<style type="text/css">
td {
border-style:solid;
border-color:black;
}
</style>
</head>
<body>
<table id="board">
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
<input type="button" value="Shuffle" onclick="change()"/>
</body>
</html>
you could try something like:
<script type="text/javascript">
$(document).ready(function(){
$("#board tr td").hover(function()
{
$(this).css('border-color', 'red');
},
function()
{
$(this).css('border-color', 'black')
});
});
</script>
remember the type="text/javascript" on the script tag
when the page loads the $(document).ready function will be called, then it will set up the hover events.
when the mouse hovers over a td inside #board the first function will be called on this, the td you're hovering over. when the mouse moves out it will call the second function putting the border back to black.
Try this
$board.find('td').hover(function(){
$(this).css('border-color', 'red');
},
function(){
$(this).css('border-color', 'black')
})
![Interactive visualization of a graph in python [closed]](https://www.devze.com/res/2023/04-10/09/92d32fe8c0d22fb96bd6f6e8b7d1f457.gif)
加载中,请稍侯......
精彩评论