表与行间盘旋和斑马效应 [英] Table with Rowspan Hover and Zebra effect

问题描述

我正在尝试创建一个具有行间距，斑马效果的表格，并突出显示悬停时的行。我有点工作，但并不完全。

它应该是这样的： http://codepen.io/chriscoyier/pen/wLGDz 加上行上的斑马效果。不幸的是，使用jQuery或CSS的斑马效果不适用于我，因为如果我这样做，线条不会在悬停时更改。

有什么建议吗？

解决方案

http://codepen.io/anon/pen/gcBlH

基本上，这样做：

  $（tr：even） .css（'background'，'#ccc'）
  

和

  .hover {
 background：red！important; 
} 
  

I am trying to create a table that has a rowspan, zebra effect and highlights the row on hover. I kind of got it working but not quite.

It should be like this: http://codepen.io/chriscoyier/pen/wLGDz plus a zebra effect on the rows. Unfortunately a zebra effect using jQuery or CSS does not work for me as the lines won't change on hover if I do that.

Any suggestions?

解决方案

Something like this?

http://codepen.io/anon/pen/gcBlH

Basically, doing:

$("tr :even").css('background', '#ccc')

and

.hover {
   background: red !important; 
}

这篇关于表与行间盘旋和斑马效应的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！