jQuery 使用水平滑动/动画显示内容

发布于 2024-09-30 02:18:20 字数 1169 浏览 0 评论 0原文

我有一个小菜单，如下所示：

                                            Item1  |  Item2  |  Item3

菜单位于 div 内并浮动到 div 的右侧。当我将鼠标悬停在“Item1”时，我希望“子菜单”滑出到“Item1”项目的左侧。

                      Item 1.1 : Item 1.2 - Item1  |  Item2  |  Item3

我只希望在“Item1”上具有该功能。我已经找了又找了。我发现了一些示例1，可能可以配置为工作我想要的方式。但我显然缺乏这些技能。我的第一个问题是让它向左滑动/动画而不是向右，然后我也不想将其滑动到特定大小，因为“子菜单”将包含各种宽度的内容。

感谢所有提示/帮助！

谢谢！

1 - 1 ilovecolors.com.ar/jquery-sliding-menu/" rel="nofollow">http://www.ilovecolors.com.ar/jquery-sliding-menu/

2 - http://sandbox.ronggur.com/2009/01/25/jquery-tutorial-水平动画菜单/

原文

I have a small menu that looks like this:

                                            Item1  |  Item2  |  Item3

The menu sits inside a div and floats to the right in the div. When I hover "Item1" I would like a "sub menu" to slide out to the left of the "Item1" item.

                      Item 1.1 : Item 1.2 - Item1  |  Item2  |  Item3

It's only on "Item1" I'd like to have that function. I've searched and searched. I've found a few examples1 that probably could be configured to work the way I want. But I obviously lack those skills. My first problem is to make it slide/animate out to the left instead of to the right, and then I also don't want to slide it to a specific size as the "sub menu" will contain content with various width.

All tips/help is appreciated!

Thanks!

1 - http://www.ilovecolors.com.ar/jquery-sliding-menu/

2 - http://sandbox.ronggur.com/2009/01/25/jquery-tutorial-horizontal-animated-menu/

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

别再吹冷风 2024-10-07 02:18:20

我猜你的菜单

$('li:last').hover(function(){$('li').append(<li></li>);
$('li:last').addClass('submenu');
$('.submenu').show();
},function(){
$('.submenu').hide();
$('.submenu').removeClass('submenu');
});

现在在 .html() 列表中；将您的内容放入弹出菜单中

$('.submenu').html(" . . . . . . ");

i guess your menu is in list

$('li:last').hover(function(){$('li').append(<li></li>);
$('li:last').addClass('submenu');
$('.submenu').show();
},function(){
$('.submenu').hide();
$('.submenu').removeClass('submenu');
});

now with .html(); put your content inside the popping menu