例子
就像這個動畫一樣的效果,p先是隱藏的,點擊按鈕後顯示並且有動畫效果,隱藏的時候同樣。但我絕對我寫的太複雜,有沒有更簡單的方案呢(不要第三方函式庫)!
闭关修行中......
試試用transition:demo
比較簡單的思路是:
方塊無需隱藏,只需要設定高度為0就看不見了
用transition實現動畫效果
transition
不需要使用hidden和show兩個類別名稱來控制,其實它就只有兩種狀態,所以可以認為無show就是隱藏了
hidden
show
另外無需寫一個show()和hide()分開綁定,其實你這個按鈕點一下是展開,再點一下隱藏,用一個toggle()切換顯示狀態就可以了
show()
hide()
toggle()
雷雷
題主可以配合CSS3解決(如果不需要相容IE的話)
可以用jquery實現嗎?
//头部引入jquery,toggle() <body> <p>bugbugbug</p> <button>Toggle</button> <script type="text/javascript"> $(document).ready(function() { $("button").click(function() { $("p").toggle(1000); }); }); </script> </body>
試試用transition:
demo
比較簡單的思路是:
方塊無需隱藏,只需要設定高度為0就看不見了
用
transition
實現動畫效果不需要使用
hidden
和show
兩個類別名稱來控制,其實它就只有兩種狀態,所以可以認為無show
就是隱藏了另外無需寫一個
show()
和hide()
分開綁定,其實你這個按鈕點一下是展開,再點一下隱藏,用一個toggle()
切換顯示狀態就可以了
🎜我在你的程式碼上做了點修改,如下:🎜https://jsfiddle.net/boxsnake...🎜雷雷
題主可以配合CSS3解決(如果不需要相容IE的話)
可以用jquery實現嗎?