我有一個通知div,在5秒後消失。如何添加淡出效果,消失將是平穩和美好的。需要使用javascript/jquery添加淡入淡出效果到隱藏框
我現在代碼:
<script type="text/javascript">
setTimeout(function(){
document.getElementById('notification').style.display = 'none';
}, 5000);
//5secs
</script>
我有一個通知div,在5秒後消失。如何添加淡出效果,消失將是平穩和美好的。需要使用javascript/jquery添加淡入淡出效果到隱藏框
我現在代碼:
<script type="text/javascript">
setTimeout(function(){
document.getElementById('notification').style.display = 'none';
}, 5000);
//5secs
</script>
此功能將啓動文件後準備計數。可以添加到你想要的任何地方。只要它在<script></script>
標籤或不同的JS文件之間。
$(function(){
$("#notification").delay(5000).fadeOut(2000); // the 2000 is the time the fadeOut will take to disapear.
});
jsfidlle顯示此:http://jsfiddle.net/jGtTP/
setTimeout(function() {
$('#notification').attr('style', 'display: none;');
}), 5000);
$('#notification').delay(5000).fadeOut();
你會在JavaScript
塊添加這種,這種方式:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"
type="text/javascript">
</script>
<script type="text/javascript">
$(document).ready(function() {
$('#notification').delay(5000).fadeOut();
}
</script>
如果添加此,Leniel? – user1065673
一般在您的網頁的標記... –
,如果你不想使用jQuery,你可以使用jsTween(在Google上搜索它)。我在網站上使用它進行動畫,它非常好,並且(在某些情況下)比jQuery淡出對手快得多。
opacityTween = new OpacityTween(document.getElementById('notification'),Tween.strongEaseInOut, 100, 0, 5);
opacityTween.start()
將淡出對象超過5秒
它的工作,但它仍然消失得相當快。我們能控制失蹤的時間嗎? – user1065673
把'2000'改成MS想要的任何數字,這是'fadeOut'淡出的時間。 – Niels
這正是我所需要的。謝謝。 – user1065673