- 本文原于头条,更多相关文章请关注我,原创落笔承冰
一、首先我们先创建两个按钮,一个文本框,要用jQuery,所以官方库文件不要忘记了。
二、给按钮加个样式,文本框里放些字,这样好看点。
三、开始创建这两个按钮的点击事件,事件先空着。
四、忘记给多行文本框加id了。
五、开始添加放大缩小的方法吧。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <script src=";></script> <title>Document</title> <style> .big,.small{ background: black; /* 背影为黑色 */ color: white; /* 字为白色 */ border: none; /* 去掉按钮边框 */ cursor: pointer; /* 按钮上鼠标为小手形 */ } </style> </head> <body> <div> <button class="big">放大</button> <button class="small">缩小</button> </div> <textarea name="" id="comment" cols="30" rows="10"> 请关注我请关注我请关注我请关注我请关注我请关注我请关注我请关注我 请关注我请关注我请关注我请关注我请关注我请关注我请关注我请关注我 请关注我请关注我请关注我请关注我请关注我请关注我请关注我请关注我 </textarea> <script> $(".big").click(function () { $("#comment").height( $("#comment").height() + 20 ); // 点击后增加20高 }); $(".small").click(function () { $("#comment").height( $("#comment").height() - 20 ); // 点击后减20高 }); </script> </body> </html>