本文實例講述了jQuery實現感應滑鼠動畫效果自動伸長的輸入框。分享給大家供大家參考。具體實作方法如下: 複製代碼 代碼如下: jQuery實現感應滑鼠動畫效果自動伸長的輸入框 <br /> body<br /> {<br /> margin:0; padding:0; font-size:12px;<br /> }<br /> a:link {<br /> color:#1553a9; text-decoration: none;<br /> }<br /> a:visited {<br /> text-decoration:none; color: #1553a9;<br /> }<br /> a:hover {<br /> text-decoration:none; color: #f46662;<br /> }<br /> a:active {<br /> text-decoration: none; color:#f46662;<br /> }<br /> #main<br /> {<br /> width:500px; margin:0 auto; margin-top:100px;<br /> } <p>#de<br /> {<br /> display:block;width:100px; height:30px; line-height:30px; float:right; border:#b7b7b7 1px solid; padding-left:5px; border-right:0;<br /> }<br /> #go<br /> {<br /> width:30px; float:right;height:22px; border:#b7b7b7 1px solid; border-left:0; padding-top:10px; padding-left:15px; background-color:#464646; cur:pointer; #FFFFFF;<br /> }<br /> <br /> $(function(){ <p>$("#de").mouseover(function(){<br /> $("#de").animate({"width":"250px"});<br /> }).mouseout(function(){<br /> $("#de").animate({"width":"100px"});<br /> });<br /> });<br /> → 希望本文所述對大家的jQuery程式設計有所幫助。