Demo-jQuery获取焦点&文本框大小变化

来源：互联网发布：ubuntu设置图形界面编辑：程序博客网时间：2024/05/17 03:18

<!DOCTYPE html><html><head><title>test</title><meta charset="" /><script type="text/javascript" src="./jquery-1.7.2.min.js"></script><style type = "text/css"> input:focus {border:1px solid #f00;background: #f00;} </style><script type="text/javascript">$(function(){$(":input").focus(function(){$(this.addClass('focus'));}).blur(function(){$(this.removeClass("focus"));});var $content = $("#textarea");$("div > span:first").click(function(event) {if($content.height() < 500 && (!$content.is(":animated"))) {//$content.height($content.height()+50);//$content.animate({height:"+=50"},400);}});$("div > span:last").click(function(){if($content.height() > 50) {$content.animate({height:"-=50"},400)}});});</script></head><body><div><form name="form1" id="form1" action="" method="post"><fieldset><legend>个人信息</legend><div><label for="username">name:</label><input id="username" type="text"></input></div><div><label for="pass">password:</label><input id="pass" type="password"></input></div><div></div></fieldset><div><div><span>bigger</span><span>smaller</span></div><div><textarea id="textarea" rows="8" cols="12">testtesttesttesttesttesttesttesttesttesttesttesttesttest</textarea></div></div></form></div></body></html>

0 0