Home > Developer > Web Develop
<!DOCTYPE HTML><HTMLLang= "en"><Head> <MetaCharSet= "UTF-8"> <title></title> <Scriptsrc=".. /js/jquery-2.1.4.min.js "></Script> <style>. Bigger,. Smaller{Display:Inline-block;Zoom:1;vertical-align:Baseline;margin:0 2px;Outline:None;cursor:Pointer;text-align:Center;text-decoration:None;Font:14px/100% Arial, Helvetica, Sans-serif;padding:. 5em 2em. 55em;Text-shadow:0 1px 1px rgba (0, 0, 0,. 3);-webkit-border-radius:. 5em;-moz-border-radius:. 5em;Border-radius:. 5em;-webkit-box-shadow:0 1px 2px rgba (0, 0, 0,. 2);-moz-box-shadow:0 1px 2px rgba (0, 0, 0,. 2);Box-shadow:0 1px 2px rgba (0, 0, 0,. 2);Color:#fff;Border:Solid 1px #980c10;background:#d81b21;background:-webkit-gradient (linear, left top, left bottom, from (#ed1c24), to (#aa1317)); } </style></Head><Body><formAction="#"> <Divclass= "MSG"> <Divclass= "Msg_caption"> <spanclass= "bigger">Amplification</span> <spanclass= "smaller">Narrow</span> </Div> <Div> <textareaname=""ID= "comment"cols= "+"rows= "Ten">Multiline text box height change multi-line text box height change multiline text box height change multiline text box height change multi-line text box height change multiline text box height change multiline text box height change multiline text box height Change multiline text box height change multiline text box height change multi-line text box height change multiline text box height variation multiline text box height change multiline text box height change multiline text box height change multi-line textbox height change multiline text box height change multi-line textbox height Change multiline text box height change multiline text box height change multiline text box height change multi-line text box height change multiline text box height change multiline text box height change multiple lines text box height change multi-line text box height change multiline text box height change multiline text box height change multiline text box height change multi-line text box height change</textarea> </Div> </Div></form><Script> //Requirements: //1. Click to enlarge, if the height of the comment box is less than 500px, add 50px on the original base //2. Click to zoom out, if the comment box height is greater than 100px, on the original basis minus 50px $(function () { //get the height of a comment box var$comment= $("#comment"); var$height=$comment. Height (); $(". Bigger"). Click (function () { if($height< -) {
//The first type // $comment. Animate ({height: "+ ="});
///second $comment. Animate ({height: "+=50"}, ); } }); //Zoom Out $(". Smaller"). Click (function () { if($height> -{$comment. Animate ({height:"-=50"}, -); } }); })</Script></Body></HTML>
The first type of the height property is invalid, the second is valid ... The habit of typing the space bar.
An issue with animate setting properties in jquery
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
