使用 JQuery 的双悬停菜单?
我有一个粗略的滑动菜单,如下所示:
http://www.clients.eirestudio.net/ttt/
它在大多数情况下都有效,但我希望能够将鼠标悬停在列表上,并且列表不会再次隐藏。
有什么想法吗?
我的代码:
/*
Sliding Main Menu
*/
$('ul#side_menu_list').hover(function()
{
$(this).show();
});
$('span#side_menu').hover(function()
{
$('ul#side_menu_list').stop().animate
({
left:"-=130px"},150);
$(this).stop().animate
({
left:"-=92px"},150);
},
function(){
$('ul#side_menu_list').stop().delay(400).animate
({
left:"125px"},150);
$(this).stop().animate
({
left:"45px"},150);
});
I have a rough sliding menu as shown here:
http://www.clients.eirestudio.net/ttt/
It works for the most part but I want to be able to hover over the list and for the list not to hide away again.
Any ideas?
My code:
/*
Sliding Main Menu
*/
$('ul#side_menu_list').hover(function()
{
$(this).show();
});
$('span#side_menu').hover(function()
{
$('ul#side_menu_list').stop().animate
({
left:"-=130px"},150);
$(this).stop().animate
({
left:"-=92px"},150);
},
function(){
$('ul#side_menu_list').stop().delay(400).animate
({
left:"125px"},150);
$(this).stop().animate
({
left:"45px"},150);
});
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
我会将它们放在包装器中
,然后在“popuout”类上设置悬停功能
,在这里我将为单个弹出 div 制作动画,并根据布局放置它们。
如果您愿意的话,您当然仍然可以单独为它们设置动画? :P
编辑
然后你就这样做(记住让弹出类足够宽,以便它们在里面动画):
I would put them inside a wrapper
And then make the hover function on the "popuout" class
Here i would animate the single popout div, and have them placed accordingly to the layout.
You could ofcourse still animate them seperatly if you would want that? :P
EDIT
Then you just do (remember to have the popout class be wide enough for them to animate inside):