在JavaScript中应用CSS

Question

在将CSS应用于Javascript时，我需要帮助。 由于我不擅长此事，所以我只想问所有认识的人。 无论如何，我在菜单悬停中使用JS。 下面是代码：

$(function(){
     $('a img').hover(function(){
        $(this).attr('src', $(this).attr('src').replace('_off', '_on'));
          }, function(){
             if (!$(this).hasClass('currentPage')) {
             $(this).attr('src', $(this).attr('src').replace('_on', '_off'));
        }
   });
});

在我的HTML中，它看起来像这样：

<tr>
<td valign="top"><a href="#"><img src="img/tabs_01_off.png" width="229" alt="tabs_01"/></a></td>
<td valign="top"><a href="#"><img src="img/tabs_02_off.png" width="229" alt="tabs_02"/></a></td>
<td valign="top"><a href="#"><img src="img/tabs_03_off.png" width="229" alt="tabs_03"/></a></td>
<td valign="top"><a href="#"><img src="img/tabs_04_off.png" width="229" alt="tabs_04"/></a></td>
</tr>

鼠标悬停适用于所有选项卡，但是我希望将鼠标悬停在选项卡1和4时，只需覆盖后面的内容即可。 它不应使内容下降，但这实际上就是现在发生的情况。 建议我使用position:relative和z-index: -1因为使用溢出时，它可能无法在IE6中使用。 所以请帮忙，谢谢！

Answer 1

你可以用它来添加一个类

$(this).addClass("myClass");

如果您确实想使用.css语法，则每次样式更改都需要一个调用，如下所示：

  $(this).css('position','fixed');
  $(this).css('z-index','1');

这是您的代码的jsfiddle，其中包含您要更改的CSS的猜测。 jsfiddle.net/G4BgT请提供有关您想要发生的事情的更多信息。