例子
就像這個動畫一樣的效果,p先是隱藏的,點擊按鈕後顯示並且有動畫效果,隱藏的時候同樣。但我絕對我寫的太複雜,有沒有更簡單的方案呢(不要第三方函式庫)!
为情所困2017-06-30 10:01:55
比較簡單的思路是:
方塊無需隱藏,只需要設定高度為0就看不見了
用transition
實現動畫效果
不需要使用hidden
和show
兩個類別名稱來控制,其實它就只有兩種狀態,所以可以認為無show
就是隱藏了
另外無需寫一個show()
和hide()
分開綁定,其實你這個按鈕點一下是展開,再點一下隱藏,用一個toggle()
切換顯示狀態就可以了
高洛峰2017-06-30 10:01:55
可以用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>