jquery顯示和刪除信息

-4

.newsUpdateComplited{ 
height: auto; 
background-color: #C5FFB2; 
border:1px solid black; 
margin-left:5px; 
margin-right:5px; 
margin-top:10px; 
border-radius: 5px; 
padding:3px; 
visibility:hidden;

這是我的css 我想顯示它，並在幾秒後delate它。如何做到這一點。我正在尋找一些教程，但我沒有找到任何好的。有人可以幫我請jquery顯示和刪除信息

來源

2015-01-16 ArturK.

JQuery在哪裏？你需要在你的問題中包含代碼。 –

這是CSS，它與jQuery有什麼關係？ – Devin

我正在尋找能夠解釋我如何使用jquery的人。 –

你可以在它上面設置一個定時器。這將是4秒鐘。

$('.newsUpdatedComplited').show(); 
setTimeout($('.newsUpdatedComplited').hide(), 4000);

您可能需要更改visibility：hidden的;爲display：無改爲。

來源

2015-01-16 21:19:00 natejd04

使用原生JavaScript功能setTimeout爲此。 setTimeout需要參數。 1st是一個函數，第二個是以毫秒爲單位等待的時間。這將有它等待3秒鐘才能顯示：

setTimeout(function(){ 
    $('.newsUpdateComplited').show(); 
}, 3000);

您還可以使用jQuery的fadein了一個順暢的效果：

setTimeout(function(){ 
    $('.newsUpdateComplited').fadeIn(); 
}, 3000);

還有，如果你實際的DOM元素.newsUpdateComplited前插入此代碼你需要添加jQuery的DOM準備好：

$(document).ready(function(){ 
    setTimeout(function(){ 
     $('.newsUpdateComplited').fadeIn(); 
    }, 3000); 
});

來源

2015-01-16 21:18:31

已經有一個JQuery答案和一個Javascript的答案。考慮到問題缺乏清晰性，爲了多樣性，我想提出一個純粹的CSS替代方案！

你可以指定一個CSS關鍵幀動畫，就像這樣：

@-webkit-keyframes animation { 
    0% { 
     opacity: 1; 
    } 
    100% { 
     opacity: 0; 
    } 
}

，然後將其添加到您的newsUpdate元素：

-webkit-animation-name: animation; 
-webkit-animation-duration: 4s; 
-webkit-animation-iteration-count: 1; 
-webkit-animation-delay: 2s; 
-webkit-animation-fill-mode: forwards;

退房this JSFiddle！

聲明：這樣做的支持是可怕的。

來源

2015-01-16 21:30:16

這很好，但我想使用Display：none –

您應該通過更改動畫元素的「高度」來達到相同的效果。 [檢查出來。]（http://jsfiddle.net/r4uptfrk/1/） –

jquery顯示和刪除信息

回答

相關問題