How to hide flash message after few seconds?

jquery flash-message

sweety · Jul 2, 2015 · Viewed 38.4k times · Source

In my application user can post challenge for other user. So after successful posting a challenge I am displaying one flash message for the same. But now I want to hide this message after some few seconds. So I wrote following code :

$(document).ready(function(){
    setTimeout(function() {
        $("#successMessage").hide('blind', {}, 500)
    }, 5000);
});

<div id="successMessage" style="text-align:center; width:100%">
    <FONT color="green">
        <%if flash[:alert]=="Your challenge is posted successfully."%> 
            <h4><%= flash[:alert] if flash[:alert].present? %>
        <%end%>
    </font>
</div>

But this code is not hiding the div "successMessage".

Answer

You can try :

setTimeout(function() {
    $('#successMessage').fadeOut('fast');
}, 30000); // <-- time in milliseconds

If you used this then your div will be hide after 30 sec.I also tried this one and it worked for me.

How to hide flash message after few seconds?

Answer

Related questions