jquery - 我没有让我的 jquery 菜单在下面的代码中向下滑动

Question

当鼠标移到一个 id="non_tech" 的元素上时，没有让 div_tech div 向下滑动，该元素位于另一个 div 中，鼠标滑过“事件”
相关的 html 代码是

<div class="events">
   <img src="arrow.png" alt="arrow" class="img_arw" />
   <table class="tab_evnts">
      <tr>
         <td class="eve_mentd" id="tech">
            <a href="#">
                <span class="eve_men">Technical</span>
            </a>
         </td>
      </tr>
      <tr>
         <td class="eve_mentd" id="non_tech">
            <a href="#">
               <span class="eve_men">Non- Technical</span>
            </a>
         </td>
      </tr>
      <tr>
         <td class="eve_mentd" id="gamers">
            <a href="#">
               <span class="eve_men">Gamer&#39;s Inn</span>
            </a>
         </td>
      </tr>
   </table>
   <div class="tech_div">
   </div>
</div>

<table >
<tr>
<td class="menu"><a href="#" title="Home">Home</a></td>
<td class="menu"><a href="#" id="eves">Events</a></td>
<td class="menu"><a href="#" title="Tuneback">Tuneback</a></td>
<td class="menu"><a href="#" title="Registration">Registration</a>
</td><td class="menu"><a href="#"title="Helpdesk">Helpdesk</a></td>
</tr>
</table>

相关的jquery代码是

$(document).ready(function() {
    $('#eves').mouseenter(function() {
        $('.events').stop().slideDown("fast");
    }, function() {
        $('.events').stop().slideUp("fast");
    });
    $('#non_tech').hover(function() {

        $("tech_div").slideDown("slow");
    });
});​

Answer 1

你的错误在选择器中

$('#eves').mouseenter(function() {

在您的标记中，您定义了一个如此命名的类，而不是一个 id。试试这个

$('.eves').mouseenter(function() {

好吧...我不确定使用表格来滑动菜单是否可行，也许你应该试试 ul。

Answer 2

mouseenter不带两个功能..我认为您正在寻找.hover()或组合mouseenterandmouseout

看起来您缺少类选择器

$(".tech_div").slideDown("slow");
   ^---------  Missing the class Selector

---

$('#eves').on({
    mouseenter: function() {
        $('.events').stop().slideDown("fast");
    },
    mouseout: function() {
        $('.events').stop().slideUp("fast");
    }
});

$('#non_tech').hover(function() {
    $(".tech_div").slideDown("slow");
});​

更新

$('#eves').on({
    mouseenter: function() {
        $('.events').stop().slideDown("fast");
    }
});

$('#non_tech').hover(function() {
    $(".tech_div").slideDown("slow");
}, function() {
    $(".tech_div").slideUp("slow");
});​

检查小提琴