jquery - 在菜单项之间滑动打开的水平子菜单

Question

我正在尝试创建一个水平菜单，其中一个在左侧，一个在右侧，但是当我将菜单与右侧的子菜单对齐时，会出现一些由“宽度”引起的奇怪的抽搐效果，我认为它只发生在正确的。有谁知道如何在具有不透明度效果的悬停水平子菜单上创建平滑滑动。请一个需要帮助！

   $(function() {
    $('.sub-menu').hide();

    $('.link').hover(function() {            
            $('.sub-menu', this).stop().animate({
                width: 'toggle',
                opacity: 'toggle'
            } /* [, duration in ms] */);
        }
    );
});

演示 jsfiddle

代码使用链接

Answer 1

空间是问题。

在您的小提琴中，About和UL之后有一个空格，inline-block所以删除空格并给padding-left. .sub-menu那解决了。

使固定：

​.sub-menu li:first-child {padding-left: 5px;}​

小提琴：http: //jsfiddle.net/zR5Tx/2/