How to hide a div after some time period?
I need to hide a div
(like "mail sent successful" in Gmail) after a certain time period when I re开发者_JS百科load the page.
How can I do that?
Here's a complete working example based on your testing. Compare it to what you have currently to figure out where you are going wrong.
<html>
<head>
<title>Untitled Document</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$(document).ready( function() {
$('#deletesuccess').delay(1000).fadeOut();
});
</script>
</head>
<body>
<div id=deletesuccess > hiiiiiiiiiii </div>
</body>
</html>
In older versions of jquery you'll have to do it the "javascript way" using settimeout
setTimeout( function(){$('div').hide();} , 4000);
or
setTimeout( "$('div').hide();", 4000);
Recently with jquery 1.4 this solution has been added:
$("div").delay(4000).hide();
Of course replace "div" by the correct element using a valid jquery selector and call the function when the document is ready.
setTimeout('$("#someDivId").hide()',1500);
$().ready(function(){
$('div.alert').delay(1500);
$('div.alert').hide(1000);
});
div.alert{
color: green;
background-color: rgb(50,200,50, .5);
padding: 10px;
text-align: center;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="alert"><p>Inserted Successfully . . .</p></div>
You can also use...
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
setTimeout(function(){
$(".signup-success").fadeOut(1500);}, 5000);
});
</script>
精彩评论