2013-04-20 137 views
1

我試圖在我的網站上創建一個優雅的重置功能,以便當用戶按下重置按鈕時,輸入框淡出用戶輸入文本,然後淡入佔位符文本,準備好文本重新進入。淡入淡出輸入文字jquery

$.each($('input.search-box'), function() { 

    var $input = $(this); 

    // fade out text - this currently fades the whole element.. which I don't want 
    $input.animate({ opacity: 0 }, 1000, function() { 

     // reset to default value 
     $input.val(""); 

     // fade text back in 
     $input.animate({ opacity: 1 }, 1000) 
    }); 

}); 

上面顯示了我想實現。但是這個變淡整個輸入了那麼英寸可能有人請告訴我如何做到只對文本這種效果呢?

非常感謝,

凸輪。

+0

一個CSS3過渡可能工作 - http://www.css3.info/preview/css3-transitions/ – 2013-04-20 00:42:31

回答

0

我在考慮將動畫值文本顏色設置爲背景輸入顏色,但jQuery不支持顏色動畫,因此您需要使用color插件或jQuery UI。兩者都允許您使用您用於背景顏色和顏色等屬性的語法。

喜歡看到here