jQuery .animate()’toggle’

2019年8月3日 186次阅读

我一直在玩一个jQuery导航菜单,为了举个例子我做了一个模拟：

http://jsfiddle.net/DerFlatulator6/3jYhh/1/

我遇到了一个问题,它几乎与我希望它完全相反.我的悬停事件代码是这样的：

$(this)
    .addClass('selected')
    .children('ul')
        .animate({'height': 'toggle'}, 300);

经过一些修补,我想出了这个

$(this)
    .addClass('selected')
    .children('ul')
        .css('height', 'toggle')
        .animate({'height': 'toggle'}, 300);

哪个有效,但我不明白为什么！有人能够准确解释发生了什么吗？

一个侧面问题……你会注意到小提琴有一个3级菜单,其中代码是垂直和水平下拉隔离的,是否有很好的方法来编写一个函数来覆盖它们,或者我应该留下它原样？

最佳答案 animate({‘height’：’toggle’},300)就像从当前到0的动画高度,如果高度更多是0,或者如果当前为0则从0到先前的动画.

来自文档http://api.jquery.com/animate/

In addition to numeric values, each property can take the strings
‘show’, ‘hide’, and ‘toggle’. These shortcuts allow for custom hiding
and showing animations that take into account the display type of the
element.

点赞