本文實例講述了jQuery實現感應鼠標動畫效果自動伸長的輸入框。分享給大家供大家參考。具體實現方法如下：
#de
{
display:block;width:100px; height:30px; line-height:30px; float:right; border:#b7b7b7 1px solid; padding-left:5px; border-right:0;
}
#go
{
width:30px; float:right;height:22px; border:#b7b7b7 1px solid; border-left:0; padding-top:10px; padding-left:15px; background-color:#464646; cursor:pointer; color:#FFFFFF;
}
</style>
<script type="text/javascript">
$(function(){
$("#de").mouseover(function(){
$("#de").animate({"width":"250px"});
}).mouseout(function(){
$("#de").animate({"width":"100px"});
});
});
</script>
</head>
<body>
<div id="main">
<div id="ss"><div id="go">→</div><input type="text" id="de"/></div>
</div>
</body>
</html>
希望本文所述對大家的jQuery程序設計有所幫助。
新聞熱點
疑難解答
