Javascript 鼠标悬停图片时使用jQuery显示带有链接的表

我正在尝试创建一个包含多个链接的表，以便在鼠标移动到jQuery上并显示图像时显示这些链接。这是可行的，但当我将鼠标移离图像时，表格会隐藏。当我把鼠标放在桌子上时，我需要让桌子可见。我是编程新手，希望你能帮助我

以下是HTML表格：

<table class="menu">
                      <tr>
                        <td valign="top" width="130">
                            <a href="#">Link 1</a><br />
                            <a href="#">Link 2</a><br />
                            <a href="#">Link 3</a><br />
                        </td>
                        <td valign="top" width="130">
                            <a href="#">Link 4</a><br />
                            <a href="#">Link 5</a><br />
                            <a href="#">Link 6</a><br />
                        </td>
                        <td valign="top" width="130">
                            <a href="#">Link 7</a><br />
                            <a href="#">Link 8</a><br />
                            <a href="#">Link 9</a><br />
                        </td>
                      </tr>
                    </table>

---

提前非常感谢

据我所知，如果删除一些东西，代码应该可以工作。您不需要两个$document.ready调用，只需将所有内容封装在一个中即可。因此，如果您将代码更改为：

$(document).ready(function(){
  $('.picture').mouseover(function(){
    $('.menu').fadeIn('fast');
  })
})

---

一切都会好起来的。另外，请确保在CSS中，表格显示为“无”或“隐藏”。

以下是@Charlietfl建议的解决方案：

HTML

$document.readyfunction{ $'.picture div'.mouseoverfunction{ $'.menu'.fadeIn'fast'； } .鼠标移动功能{ $'.menu'.fadeOut'fast'； } 穆塞莱夫先生； };

---

这个代码的结果是什么？最简单的方法是将表和图像放在同一个父对象中，并在父对象上使用鼠标事件单击我在回答中给出的链接。有一个工作代码，它不会改变操作代码的行为。很明显，用户无法访问其中的链接。menuYou是对的，我完全错过了这一部分。我将编辑我的答案。谢谢！这解决了我的问题！现在，我遇到的下一个问题是，我有4张图片以内联方式显示，当鼠标悬停在左侧的第一张图片上时，表格淡入，所有其他图片都放在表格下。这通过相对定位父分区内的绝对定位得到解决。非常感谢您的支持救命啊，彼特卡和@charlietfl！！！

$(document).ready(function(){
  $('.picture').mouseover(function(){
    $('.menu').fadeIn('fast');
  })
})

<div class="picture-div">
    <img src="..." class="picture"/>
    <table class="menu">
    .......
    </table>
</div>

$(document).ready(function(){
    $('.picture-div').mouseover(function(){
        $('.menu').fadeIn('fast');
    })
    .mouseleave(function(){
        $('.menu').fadeOut('fast');
    })
    .mouseleave();
});