jquery同一按钮实现不同的动画

                                     jquery同一按钮实现不同的动画

     今天给大家介绍一个有意思的事，有关jQuery动画的实现，同一按钮点击奇数次与偶数次显示不同的动画，而且动画的变化是流畅的.

实现功能描述：

      初始界面是一个按钮，按钮下边有菜单，当点击按钮时，该菜单会隐藏，而且按钮的样式也会发生变化，再次点击该按钮时，又会回到初始界面。（在浏览器中运行时，一直想点击，根本停不下来）

实现过程：

1.需要的依赖：jquery-3.1.1.min.js

2.初始界面的实现：实现内容包括按钮和一个下拉菜单，每个菜单项是一个a标签

html代码如下：

    <button id="btn1"></button>
    <div id="div3">
            <a  href="jquery1-1.htm">天气</a><br><br>
            <a id="a2" href="#">路况</a><br><br>
            <a id="a3" href="#">水质</a><br><br>
            <a id="a4&