Jquery：点击下拉菜单

Question

我想创建一个订单。 我有以下内容：

如何设置动画以向下滑动？ 我知道函数.slideDown（）/ .slideUp（）或.slideToggle。 但我也希望为按钮设置动画。所以，对我来说变得困难。

第二个问题：没有图像我能意识到吗？

Answer 1

对margin-top使用jquery animate。它看起来比动画高度更好：

 $("#handler").click(function(){    

$('#opener, #closer').toggle();

var container = $( "#container" ),
    mt = container.css('margin-top').split('px')[0],
    op = (mt<0)?'+=169px':'-=169px';

 container.animate({
        'margin-top': op
    }, 500); 
});

以下是一个示例：JSFiddle

Answer 2

您可以使用postion: absolute按钮进行操作。

检查这是否对您有所帮助。 http://codepen.io/anon/pen/wakgp

Answer 3

使用CSS来塑造手柄而不是背景的图像和渐变，但这应该是您的起点。

$("#handler").click(function(){    

$('#opener, #closer').toggle();

var container = $( "#container" ),
    mt = container.css('margin-top').split('px')[0],
    op = (mt<0)?'+=169px':'-=169px';

 container.animate({
        'margin-top': op
    }, 500); 

}）;

JSFiddle