Question

当我将鼠标悬停在导航上时，如何删除活动课程。这是我的代码

<li  <?php if (strpos($_SERVER['PHP_SELF'], $navserver[1])) echo 'class="active"';?>><?php echo '<a href="'.$navlink[1].'">',$navdesc[1] ?></a></li>
<li  <?php if (strpos($_SERVER['PHP_SELF'], $navserver[2])) echo 'class="active"';?>><?php echo '<a href="'.$navlink[2].'">',$navdesc[2] ?></a></li>
<li  <?php if (strpos($_SERVER['PHP_SELF'], $navserver[3])) echo 'class="active"';?>><?php echo '<a href="'.$navlink[3].'">',$navdesc[3] ?></a></li>
<li  <?php if (strpos($_SERVER['PHP_SELF'], $navserver[4])) echo 'class="active"';?>><?php echo '<a href="'.$navlink[4].'">',$navdesc[4] ?></a></li>
<li  <?php if (strpos($_SERVER['PHP_SELF'], $navserver[5])) echo 'class="active"';?>><?php echo '<a href="'.$navlink[5].'">',$navdesc[5] ?></a></li>
<li  <?php if (strpos($_SERVER['PHP_SELF'], $navserver[6])) echo 'class="active"';?>><?php echo '<a href="'.$navlink[6].'">',$navdesc[6] ?></a></li>

Answer 1

你可以用jQuery这样做，但我建议你只使用：hover in css（.active：hover）并覆盖你想要的样式。

Answer 2

你可以在jQuery中使用这样的东西：

$( selector ).mouseenter( handlerIn ).mouseleave( handlerOut );

http://api.jquery.com/hover/

您可以使用以下内容：

$( "td" ).hover(
  function() {
    $( this ).addClass( "hover" );
  }, function() {
    $( this ).removeClass( "hover" );
  }
);

Answer 3

你可以使用css的:Hover属性，这是最简单的方法，也是您可以使用以下jquery

添加或删除类

$('#elm').hover(
       function(){ $(this).addClass('active') },
       function(){ $(this).removeClass('active') }
)

其中#elem是您元素的ID，只需为您的<li>提供任何ID，

然后您可以添加或删除任何类。

<强>更新

<li  <?php if (strpos($_SERVER['PHP_SELF'], $navserver[1])) echo 'class="active lihover"';?>><?php echo '<a href="'.$navlink[1].'">',$navdesc[1] ?></a></li>
<li  <?php if (strpos($_SERVER['PHP_SELF'], $navserver[2])) echo 'class="active lihover"';?>><?php echo '<a href="'.$navlink[2].'">',$navdesc[2] ?></a></li>
<li  <?php if (strpos($_SERVER['PHP_SELF'], $navserver[3])) echo 'class="active lihover"';?>><?php echo '<a href="'.$navlink[3].'">',$navdesc[3] ?></a></li>
<li  <?php if (strpos($_SERVER['PHP_SELF'], $navserver[4])) echo 'class="active lihover"';?>><?php echo '<a href="'.$navlink[4].'">',$navdesc[4] ?></a></li>
<li  <?php if (strpos($_SERVER['PHP_SELF'], $navserver[5])) echo 'class="active lihover"';?>><?php echo '<a href="'.$navlink[5].'">',$navdesc[5] ?></a></li>
<li  <?php if (strpos($_SERVER['PHP_SELF'], $navserver[6])) echo 'class="active lihover"';?>><?php echo '<a href="'.$navlink[6].'">',$navdesc[6] ?></a></li>

然后使用，

<script>
$('.lihover').hover(          
       function(){ $(this).removeClass('active') }
)
</script>

删除悬停CSS上的活动类

3 个答案: