改变元素的高度
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>改变元素高度</title> <script type="text/javascript" src="./js/jquery-1.8.3.min.js"></script> <style type="text/css"> body { margin: 0px; padding: 0px; } h2 { background-color: blue; color: white; margin: 0px; } </style> <script type="text/javascript"> $(function(){ $("h2").click(function(){ $(".txt").slideUp("slow"); $(".txt").slideDown("fast"); }) }); </script> </head> <body> <div id="box"> <h2>窗边的小豆豆</h2> <div class="txt"> <p>本书讲述了作者上小学的一段真实的故事。</p> <p>作者因淘气被学校退学后,来到巴学园。在小林校长的爱护和引导下,一般人眼里"怪怪"的小豆豆逐渐成了一个大家都能接受的孩子,并奠定了她一生的基础。</p> <p>这本书不仅给世界千万读者无数的笑声和感动,而且为现代教育的发展注入了新的活力,成为20世纪全球最具影响的作品之一。</p> </div> </div> </body> </html>