淡入淡出按鈕單擊

我的代碼存在問題。我想顯示一個加載動畫（我有.gif格式）。唯一的問題是，當我點擊按鈕時，動畫顯示的時間不到一秒鐘，然後消失。我究竟做錯了什麼？淡入淡出按鈕單擊

HTML：

<form action="" method="post"> 
<button id="act">Click me</button> 
</form> 
<div class="loading"></div><!--my Animation-->

的Jquery：

$(function() { 
    $(".loading").css("display","none"); 
    $("#act").click(function() { 
     $(".loading").fadeIn("slow"); 
    }); 

    });

謝謝！

來源

2013-07-05 Or Amranov

而不是「慢」嘗試給一個像3000這樣的值..這將是毫秒......所以給一個相應的值。 –

像這樣變化。

$("#act").click(function() { 
$(".loading").css("display", "block").css("opacity", "0"); 
$(".loading").fadeIn("slow"); 
});

來源

2013-07-05 13:05:50 user10

你會停供透過按鈕的默認操作（submiting形式），你需要的e參數添加到功能和停止默認操作。

$(function() { 
    $(".loading").css("display","none"); 
    $("#act").click(function(e) { 
     e.preventDefault(); //This will stop it. 
     $(".loading").fadeIn("slow"); 
    }); 

    });

來源

2013-07-05 13:05:58 Skatox

我正要準備一個小提琴後發佈這個 - [這是一個工作示例]（http://jsfiddle.net/umjUN/）。 – freejosh

非常感謝！幫助了我很多！ –

不客氣:)然後選擇這個作爲答案。 – Skatox

可以用毫秒爲淡入直接

$(".loading").fadeIn(2000);// this will fadin in 2 seconds

來源

2013-07-05 13:06:20

我不能完全肯定，但我認爲顯示，沒有一個是給你的麻煩。相當困難的編碼到CSS中，並將其作爲$（「。loading」）。show（）或hide（）在必要時使用。首先點擊顯示，然後您可以選擇何時隱藏以及何時手動顯示。更靈活。

來源

2013-07-05 13:08:20 Delrog

.show（）或.hide（）是動畫的問題。我想他想要一個fadeIn（）效果。 –

你可以嘗試使用Bhushan Kawadkar所說的時間播放，或者在需要時只使用隱藏效果和fadeIn（毫秒）。 – Delrog

添加內聯顯示：無;樣式爲.loading元素並從函數中刪除css（「display」，「none」）

來源

2013-07-05 13:09:16

雖然JQuery解決方案非常簡單，但我會考慮CSS3動畫。它們比內置的淡入淡出功能更平滑。

來源

2013-07-05 13:12:12 user2550807

淡入淡出按鈕單擊

回答

相關問題