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

Question

我正在尝试创建一个水平菜单，左侧和右侧有一个水平子菜单，但是当我将菜单与右侧的子菜单对齐时，“宽度”引起了一些奇怪的抽搐效果我认为它只是发生在右边。有没有人知道如何在具有不透明效果的悬停水平子菜单上创建平滑滑动。请帮忙！

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

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

Demo jsfiddle

Code used link

Answer 1

空间是个问题。

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

修正：

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

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