CODEWITHSUNDEEP
jqueryhtml
user1915190
user1915190

Reputation: 307

Hide a div if appeared

I have a message box div in my page which will appear after succesfully submitting a form. I want to hide it after some time as it appears.

I have tried this code in the chrome developer tool and it works.

$(document).ready(function(){
   if ($('#notification').is(":visible")) {
       $('#notification').delay(1000).fadeOut();
   }
});

But when I inserted this code to my page, its not working.

Kindly give me a solution for this.

Thank you & Regards,

Upvotes: 0

Views: 80

Answers (3)

hjpotter92
hjpotter92

Reputation: 80629

You can use the setTimeout call:

setTimeout( function() {
    if ($('#notification').is(":visible")) {
       $('#notification').delay(1000).fadeOut();
   }
}, 3000);

Upvotes: 0

Rodik
Rodik

Reputation: 4092

you are running this code inside a dom-ready function: $(document).ready(function(){ ...

This means that the code will run once when the page finishes loading, and at that time the notification is probably not visible, and so the code continues and will not run this again.

you need to bind this function to run every time the form is submitted, using jQuery's .submit() method.

Upvotes: 5

Samuel Liew
Samuel Liew

Reputation: 79022

$('#myForm').submit(function() {
    $('#notification').fadeIn().delay(3000).fadeOut();
});

Upvotes: 0

Related Questions