0

我在一张桌子上使用了 Jquery。如果我将鼠标移到一行上，它会改变颜色。以下Javascript是为IE7制作的，效果在这里完美。当我在 Firefox 中运行此脚本时，文本会随着背景消失。Firefox 中的此效果在淡出时显示空（白色）行。可能他这样做是因为效果是整个行。

有没有办法让文本始终可见？（文字在 a 中）

$(document).on({
         mouseenter: function(e) {
             $(this).fadeIn('fast', function() {
                $(this).addClass("white");
            });
         },
         mouseleave: function(e) {
             $(this).fadeOut('fast', function() {
                $(this).removeClass("white");
            });

            $(this).fadeIn('fast', function() {
                $(this).addClass("grey");
            });
         }
    }, 'table[id*="tbl_main"] tbody tr[id*="dataCell_"]');

表格一行的html：

<tr id="ctl00_contentHolder_dataCell_lbl_currencyMisc0" class="grey">
<td align="center"><input type="image" name="ctl00$contentHolder$0-181337" id="ctl00_contentHolder_0-181337" runat="server" src="img/plus.gif" style="border-width:0px;" /></td>
<td title="New Network Hub" align="center">181337</td><td align="center">11337.06</td>
<td align="center"><span id="ctl00_contentHolder_lbl_currencyMisc1">USD</span></td>
<td align="center">6</td><td align="center">31337.36</td><td align="center"><span id="ctl00_contentHolder_lbl_currencyReport1">USD</span></td>
<td align="center">12</td><td align="center">13371.3</td><td align="center">63.82%</td>

4

2 回答 2

1

您正在尝试fadeIn或元素。如果 Firefox 没有显示之后的内容，它会很好地工作，因为它应该被隐藏（使用 CSS -> ）。这就是:) 的使命——看看 API。fadeOuttrfadeOutdisplay:nonefadeOut

如果我理解您的问题，您想以平滑的效果更改背景颜色。如果是，那么 JQuery UI.toggleClass(...)就是您要搜索的内容。JQuery 库也有一个toggleClass(...)方法，但没有任何效果。它会立即更改课程。

我在JSFiddle上创建了一个示例。

于 2013-03-20T10:19:01.507 回答
0

我认为你应该试试这个：

 var state = true;
 $( "#tab tr" ).hover(function() {
    if ( state ) {
       $(this).stop().animate({
        backgroundColor: "#f99"
       }, 500 );
   } else {
      $(this).stop().animate({
        backgroundColor: "#fff"
      }, 500 );
   }
   state = !state;
  });
});

检查垃圾箱

为此，jQuery ui library如果您想为颜色设置动画，您需要一个。

于 2013-03-20T10:35:10.370 回答