SlideDown Div與關閉鏈接

我想使用滑動DIV顯示一些消息，如「配置文件已更新」。

這是我的代碼。當我加載頁面時，DIV向下滑動並在幾秒鐘後消失（延遲）。但我希望能夠在超時之前通過鏈接關閉DIV，但我無法將SlideUp添加到它...爲什麼？

$("#message").hide(); 

    $("#message").slideToggle('slow', function() { 
     $(this).delay(2000).slideToggle("slow"); 
    }); 

    $("#close").click(function() { 
     $("#message").slideUp(); 
    }); 
    }); 

    <div id="message" style="display:none; border: 3px solid #ccc; width: 500px; height: 30px; background: #eee;"> 
    A message goes here! <a id="close" href="#" style="float: right;">Close div</a> 
    </div>

來源

2011-01-25 Dannemannen

嘗試添加.stop()到您的關閉div點擊事件。

$("#close").click(function() { 
    $("#message").stop().slideUp(); 
});

jsfiddle例如

來源

2011-01-25 13:21:29

其實，你可能想使用clearQueue函數。這有點嚴厲，然後停下來，但你肯定會停止動畫。 http://api.jquery.com/clearQueue/ – Exelian 2011-01-25 13:30:35

這是因爲動畫jQuery中排隊。 slideUp效果將只在延遲slideToggle效果完成後運行，並且您的<div>元素將在當時隱藏。

需要調用stop()取消延遲，如@馬克建議，但你可能想傳遞true在其第一個參數：

$("#close").click(function() { 
    $("#message").stop(true).slideUp("slow"); 
});

這樣一來，所有的特效排隊的<div>元素將被清除，不僅是當前正在運行的那個。

來源

2011-01-25 13:30:45

就像一個魅力！謝謝：） – Dannemannen 2011-01-25 13:39:18

SlideDown Div與關閉鏈接

回答

相關問題