Question

我对jQuery很新。只是想尝试一下。我喜欢这里演示的标签功能：

http://jqueryui.com/demos/tabs/#mouseover

我真的很喜欢这个，但我希望它有点像菜单。特别是我希望标签内容出现在页面上的内容上（如菜单）。此外，正如当我翻转标签时内容发生变化，当我没有翻过任何标签时（或者当用户点击页面上的任何其他位置时），我希望标签内容消失（如菜单）。

所以我真的想把它用作菜单。如果有人知道菜单控件可以解决我的问题也可以。我只是喜欢这样一个事实：当我将鼠标悬停在某个项目上时，会弹出一个div。我想在每个div中添加一些文本和两个按钮。

谢谢！

这是我原来的：这在标题中：

$("#tabs").tabs().find(".ui-tabs-nav").sortable({ axis: 'x' });
$("#tabs").tabs({ event: 'mouseover' });

这就是身体：

 <div id="tabs">
            <ul>
                <li><a href="#tabs-1">First</a></li>
                <li><a href="#tabs-2">Second</a></li>
                <li><a href="#tabs-3">Third</a></li>
            </ul>
            <div id="tabs-1">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div>
            <div id="tabs-2">Phasellus mattis tincidunt nibh. Cras orci urna, blandit id, pretium vel, aliquet ornare, felis. Maecenas scelerisque sem non nisl. Fusce sed lorem in enim dictum bibendum.</div>
            <div id="tabs-3">Nam dui erat, auctor a, dignissim quis, sollicitudin eu, felis. Pellentesque nisi urna, interdum eget, sagittis et, consequat vestibulum, lacus. Mauris porttitor ullamcorper augue.</div>
        </div>

Answer 1

jQuery支持very rich plugin model。您可能希望查看Menu Plugin而不是尝试操纵选项卡以像菜单一样工作。

Answer 2

Here's an example如何使用jQuery实现这种行为。这个例子非常简单，但你可以根据需要设计它。

使用jQuery .tabs（） - 内容叠加页面

2 个答案: