用动画放大输入元素

Question

我想扩大输入字段。所以这几乎可行，但效果是“闪亮”。该领域扩大和colapses和intersseting使第二个输入到下一行。你可以给任何建议如何做它写或以某种方式重写！？！？！

jQuery的

$('#menusearchform .s').mouseenter(function(){ 
     var $this = $(this); 
     if (!$this.data('expand')) { 
        $this.data('expand', true); 
        $this.animate({width:'+=32px',left:'-=16px'}); 
     } 
     $this.val("").focus(); 
}).mouseleave(function(){ 
     var $this = $(this); 
     $this.data('expand', false); 
     $this.animate({width:'-=32px',left:'+=16px'}); 
    }); 

HTML

<div id="divsearch"> 
    <form method="post" action="index.php" id="menusearchform"> 

      <input class="s" type="text" value="Search" name="felem1" /> 
      <input class="s" type="text" value="Search" name="felem2" /> 

      <input type="submit" value="Search" name="buttonSearch" /> 
      <input type="reset" value="Reset" name="buttonReset" id="Reset"/> 
    </form> 
</div> 

Answer 1

猜测你不想整个形式扩大。也许这是你所需要的：http://jsfiddle.net/fpgAn/1/