I had developed a small web application like twitter flash message using jQuery. It’s useful and simple just enrich your web projects. This is very simple and easy bunch of code snippets to display flash message like twitter, facebook using Jaquery.
You can see the live demo of this tutorial before go to download complete script. I have added complete code in zip file, you will get this after subscribe of our blog.
Javascript Code:
Bellow is the jQuery code which will hide messages like twitter and facebook
1 2 3 4 5 6 7 8 9 10 11 12 | <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/ jquery/1.3.0/jquery.min.js"> </script> <script type="text/javascript" > $(document).ready(function(){ setTimeout(function(){ $(".flash").fadeOut("slow", function () { $(".flash").remove(); }); }, 2000); }); </script> |
PHP code to contain html data
1 2 3 4 5 6 7 8 9 10 11 | <?php if($_SERVER["REQUEST_METHOD"] == "POST") { // Some data.... $message="<div class='flash'> Information message !</div>"; } ?> <div align="center">> <?php echo $message; ?> </div> |
If you want to change style of flash message,then you can customize bellow CSS code according to your website theme and template.
1 2 3 4 5 6 7 8 9 | .flash{ width:759px; padding-top:8px; padding-bottom:8px; background-color: #fff; font-weight:bold; font-size:20px;-moz-border-radius: 6px;-webkit-border-radius: 6px; } |
.If you like FreeWebMentor and you would like to contribute, you can write an article and mail your article to [email protected] Your article will appear on the FreeWebMentor main page and help other developers.
Article Tags: flash messages, Jquery
