<!doctype html> <html> <head> <meta charset="utf-8"> <title>无标题文档</title> <style type="text/css"> span{ background-color:brown; color: aliceblue; font-size: 18px; } .msg_c{ margin-left:140px; } #comment{ font-size:16px } </style> <script type="text/javascript" src="jquery-3.1.1/jquery-3.1.1.js"></script> <script type="text/javascript"> $(document).ready(function(){ var $commnet = $("#comment") $(".bigger").click(function(){ if(!$commnet.is(":animated")){ if($commnet.height()<100){ $commnet.animate({height:"+=200" },400) } } }) $(".smaller").click(function(){ if(!$commnet.is(":animated")){ if($commnet.height()>100){ $commnet.animate({height:"-=200"},400) } } }) }) </script> </head> <body> <form> <div class="msg"> <div class="msg_c"> <span class="bigger">放大</span> <span class="smaller">缩小</span> </div> <div> <textarea id="comment" rows="3" cols="60">[努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY努力学习JQUERY”</textarea> </div> </div> </form> </body> </html>
|