7.jQuery之显示与隐藏效果

这里用到三个函数方法：show()   hide()  toggle()

注意点是三个方法里面的两个参数的使用，前一个参数是时间，表示显示速度；后一个参数是回调函数，只有前面的动画执行完之后，回调函数才会执行

     <style>
         div {
             width: 150px;
             height: 300px;
             background-color: pink;
         }
     </style>
     <button>显示</button>
     <button>隐藏</button>
     <button>切换</button>
     <div></div>
     <script>
         $(function () {
             // $("button").eq(0).click(function () {
             //     $("div").show(1000,function(){
             //         alert(1)  // 注意show的用法，前面的显示速度，后面是回调函数，当动画执行完以后，再执行回调函数，从浏览器可以看到效果，下面的hide同理
             //     })
             // });
             // $("button").eq(1).click(function () {
             //     $("div").hide()
             // })

             $("button").eq(2).click(function () {
                 $("div").toggle()  // 这里的toggle也是有两个参数，方法同show
             })

             // 一般情况下，我们都不加参数直接显示隐藏就可以了

         })
     </script>