Looking for a fade out after success message from page

General PHP Help
#1

Hi,

Looking for a fade out after success message from page. I am using this code to place a Success message , now I want this message to fade after “submit Success” .

Can any please help me out.

This is the code in the php

function formSuccess(){
$("#contactForm")[0].reset();
submitMSG(true, “Message Submitted!”)
}

I need this message- “Message Submitted!” to fade after showing on the page.

Thanks

#2

Well, you need to do this by setting a timer. Here is one example I found that might help you.

setTimeout(function() {
 $('#final_msg').fadeOut();
}, 10000 );

This fades out the #final_msg DIV after 10 seconds. If you have Jquery 1.4, you can do it this way, too:

setTimeout(function(){$('#final_msg').fadeOut();}, 10000);
#3

setTimeout(function() {
$(’#final_msg’).fadeOut();
}, 10000 );

I am not sure where to add this script in the js and what to mention in the main page? Can you please guide me.

#4

Well, instead of explaining each part of it, here is a tutorial that walks you thru it step by step. You can download the full code and look thru it. This version has a nice way of putting the success message right next to the send button. It uses the posting of the data in the JQ code which lets you check if it posted okay.
fade-out example 1

Here is a “Fiddle” of one that uses less code and might be better for you. Either should help you put it together…
fade-out example 2

There are hundreds of ways to do this.

1 Like
#5

Hi,

Thanks. If I had to come across this news earlier I would have used it .But the Website structure is mostly done and the contact page is working fine with the message display on the page.and I do not want to disturb it by changing the whole setup. I just want to add this extra code to the after submit message. I am just looking for this small help to complete it. It is the tail end of the website.

#6

Well, just rewrite your previous version. Not sure as I am not clear on how it is being called. But, if it is currently showing the success message, just add the fade-out to it…

function formSuccess(){
$("#contactForm")[0].reset();
submitMSG(true, “Message Submitted!”);
$(“name-of-the-selector”).fadeOut(1000);
}

This really depends on what is happening in the submitMSG function that you created. If it contains an alert, you would have to deal with it thru the alert’s selector, but, if you have a DIV or

or whatever, you would need to use that selector name.

#7

Hi ,

Thanks for all your support. I think I got it. Anyways its the coming forward to help that’s important.

Thanks again

#8

Great! You are welcome! See ya in the bitstream for your next question!

Sponsor our Newsletter | Privacy Policy | Terms of Service