更改链接颜色<a>当悬停在<tr>

当我将鼠标悬停在<tr>上时，<a>元素的颜色应更改为白色。更改链接颜色<a>当悬停在<tr>

我试图用jQuery这样的事情：

<script> 
    $('tr').hover(function(){ 
     $('a').css('color','white'); 
    }); 
</script>

但这更改所有<tr>文本颜色。有什么想法？

html & css code:

来源

2012-07-05 nidis

你为什么要使用jQuery？你不能仅仅使用CSS吗？ – SmokeyPHP 2012-07-05 19:46:08

有一些方法可以做到。 .hover方法可以有两种功能（通过移动鼠标，鼠标移动了），你可以同时实现改变颜色，样品：

1 - 由JavaScript（jQuery的）

$(document).ready(function(){ 
    $('tr').hover(
    function(){ 
     var $this = $(this); 
     $this.css('background-color', '#fff'); 
    }, 
    function(){ 
     var $this = $(this); 
     // original color -> $this.css('background-color', $this.data('bgcolor')); 
     $this.css('background-color', '#000'); 
    } 
);  
});

您可以使用.data('bgcolor')以获取颜色由样式attritbute或设置在标签上的原始css设置。

2）或者只是添加CSS

.row { 
    background-color: #000; 
} 

.row : hover { 
    background-color: #fff; 
}

，并设置该行

<tr class='row'> 
... 
</tr>

来源

2012-07-05 19:44:31

此行添加到您的CSS文件，忘记了jQuery：

tr:hover a { color: white; }

如果你非常希望你的jQuery代码能够正常工作，那么你只需要将你的hiled行中的锚点作为目标：

$('tr').hover(function(){ 
    $('a', this).css('color','white'); 
});

来源

2012-07-05 19:47:39 Quantastical

@Alex - 我找到了你的答案！ – SmokeyPHP 2012-07-05 19:50:22

tr：悬停{颜色：白色; }它的工作非常简单。谢谢！ – nidis 2012-07-05 19:57:46

切记不要在你的td元素上设置一个颜色，它会覆盖tr颜色......就像我刚刚做的那样。卫生署！ – 2013-05-03 12:55:55

我不知道如果它会在你的情况下，我使网站与一个主要颜色和第二个白色。每刷新一次颜色都是随机的，所以我需要悬停元素来改变颜色。所以，我结束了：

#menu-buttons>li{ color:#fff; } 
#menu-buttons>li:hover { color: inherit; }

然后我就随机分配颜色与父元素：

$('#menu-buttons').css('color',mainColor);

来源

2013-10-03 00:26:21 entio

我正面临着类似的问题;发现这个解决方案是有效的。

 div.cntrblk tr:hover td a { 
     color:rgb(0,0,255); 
    }

来源

2015-04-01 23:37:25

更改链接颜色<a>当悬停在<tr>

回答

相关问题