使用jquery从左到右平滑地滑动元素？

Question

请看这个小提琴

http://jsfiddle.net/rabelais/43J77/1/

$('#contact').click(function () {
    $('#contact-info').animate({
        width: 'toggle'
    });
    $('#work-menu').fadeOut('100');
});
$('#menu').click(function () {
    $('#work-menu').animate({
        width: 'toggle'
    });
    $('#contact-info').fadeOut('100');
});

当点击一下联系人时，菜单会从侧面顺利滑动。单击工作时，菜单会打开，但不会像电子邮件元素一样滑动。有谁知道如何使工作菜单像电子邮件元素一样打开。

谢谢

Answer 1

看看这个：http://jsfiddle.net/43J77/4/

我更改了width的{​​{1}}并添加了此#work-menu样式：

#work-menu ul

不同之处在于，在其中一个切换元素中，文本与左侧（电子邮件）对齐，而您向左滑动，从而导致该效果，在另一个中，列表与左侧对齐，但您是滑动右边。这样，文本似乎不会移动，而只是出现。

为了创建相同的视觉效果，我只是将列表向右对齐，为了做到这一点，我必须为父元素定义#work-menu { position: fixed; bottom: 37px; left: 65px; font-size: 24px; width: 183px; /*changed*/ } #work-menu ul{ /*added*/ float:right; } 。