5.gif
4.gif
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body >
<input type="text" id="search" style="width: 100px;"/>
<script>
window.onload=function(){
search.onfocus=function(){
this.style.width=200+"px";
this.style.transition="1s";
}
search.onblur=function(){
this.style.width=100+"px";
this.style.transition="1s";
}
}
</script>
</body>
</html>