Question

好的就是这样，我得到了 2个div ，一个是我的导航，另一个具有与我的导航几乎相同ID的li标签数量相同，这些li标签包含图形，当悬停导航时，它假设为滑动。让我解释一下......

这是我的导航

<ul id="navInside">
  <li><a id="nInicio" href="index.php" >Inicio</a></li>
  <li><a id="nHistoria" href="history.php" >Historia</a></li>
  <li><a id="nQuienes" href="aboutus.php" >Quienes somos</a></li>

应该移动

<ul id="navSlides">
  <li id="SnInicio"></li>
  <li id="SnHistoria"></li>
  <li id="SnQuienes"></li>

这是我现在获得的 jQuery 代码....

    $('#navInside li').hover(function (){
    $("#S" + this.id).animate({top: '0px'}, 500)}, function (){
    $("#S" + this.id).animate({top: '-70px'}, 500, 'swing');} 
);

你可以帮助我使用右选择器来实现这个目的吗？

我被困了几天...... 谢谢

Answer 1

id位于主播上，而不是<li>（this指的是），因此您的悬停应为：

$('#navInside li a').hover(function (){
  $("#S" + this.id).animate({top: '0px'}, 500);
}, function (){
  $("#S" + this.id).animate({top: '-70px'}, 500, 'swing');
});

或者，使用您拥有的代码并将id移至<li>，如下所示：

<ul id="navInside">
  <li id="nInicio"><a href="index.php" >Inicio</a></li>
  <li id="nHistoria"><a href="history.php" >Historia</a></li>
  <li id="nQuienes"><a href="aboutus.php" >Quienes somos</a></li>

Answer 2

对不起，我不清楚$（“＃S”+ this.id）是什么？我在html中的其他任何地方都没有看到id =“S”...

jQuery幻灯片菜单悬停操作

2 个答案: