水平方向滑动隐藏

jQuery('#divFloatToolsView').animate({width: '300px', opacity: 'hide'}, 'normal',function(){ jQuery('#divFloatToolsView').hide();});

水平方向滑动显示

jQuery('#divFloatToolsView').animate({width: '300px', opacity: 'show'}, 'normal',function(){ jQuery('#divFloatToolsView').show();});

当然 把width 变成 height 就是垂直显示或隐藏了

虽然 jQuery 有一组漂亮的幻灯片效果：.slideDown()，.slideUp() 和 .slideToggle()，它们的滑动方向都是垂直的。有时，我们可能需要水平方向的滑动。最简单的方法是通过对元素的 width 属性使用 .animate() 方法来实现。

1. $(document).ready( function () {
2. $('#slidewidth button').click( function () {
3. $( this ).next().animate({width: 'toggle'});
4. });
5. });