当然slideDown，slideUp不要做你想做的事，你说你希望它是左/右，而不是上/下。
如果您对添加jquery-ui标签的问题进行编辑意味着您正在使用 jQuery UI，我会使用nnnnnn 的解决方案，使用 jQuery UI 的slide效果。
如果不：
假设菜单开始可见（编辑：哎呀，我认为这不是一个有效的假设；请参见下面的注释），如果您希望它向左滑出然后从左侧滑回，您可以这样做:实例| 直播源
$(document).ready(function() {
// Hide menu once we know its width
$('#showmenu').click(function() {
var $menu = $('.menu');
if ($menu.is(':visible')) {
// Slide away
$menu.animate({left: -($menu.outerWidth() + 10)}, function() {
$menu.hide();
});
}
else {
// Slide in
$menu.show().animate({left: 0});
}
});
});
您需要放置position: relative菜单元素。
请注意，我将您的替换toggle为click，因为该形式toggle已从 jQuery 中删除。
如果你想让菜单开始隐藏，你可以调整上面的。基本上，在将元素放在页面外时，您想知道元素的宽度。
此版本不关心菜单最初是否可见：Live Copy | 直播源
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
<div id="showmenu">Click Here</div>
<div class="menu" style="display: none; position: relative;"><ul><li>Button1</li><li>Button2</li><li>Button3</li></ul></div>
<script>
$(document).ready(function() {
var first = true;
// Hide menu once we know its width
$('#showmenu').click(function() {
var $menu = $('.menu');
if ($menu.is(':visible')) {
// Slide away
$menu.animate({left: -($menu.outerWidth() + 10)}, function() {
$menu.hide();
});
}
else {
// Slide in
$menu.show().css("left", -($menu.outerWidth() + 10)).animate({left: 0});
}
});
});
</script>
</body>
</html>