Home > ASP.Net, Javascript, Jquery > JQuery to Show a popup message at the top of browser window

JQuery to Show a popup message at the top of browser window


Hi all ,

try this example to use JQuery to Show a popup message at the top of browser window

Download jquery-1.3.2.min.js first

<script src="jquery-1.3.2.min.js" type="text/javascript"></script>
<script type="text/javascript" >
$(function() {
$('#message').fadeIn('slow');
$('#message a.close-notify').click(function() {
$('#message').fadeOut('slow');
return false;
});
});
</script>
<style type="text/css">
#message
{
font-family: Arial,Helvetica,sans-serif;
position: fixed;
top: 0px;
left: 0px;
width: 100%;
z-index: 105;
text-align: center;
font-weight: bold;
font-size: 100%;
color: white;
padding: 10px 0px 10px 0px;
background-color: #8E1609;
}
#message span
{
text-align: center;
width: 95%;
float: left;
}
.close-notify
{
white-space: nowrap;
float: right;
margin-right: 10px;
color: #fff;
text-decoration: none;
border: 2px #fff solid;
padding-left: 3px;
padding-right: 3px;
}
.close-notify a
{
color: #fff;
}
</style>

<div id="message" style="display: none;">
        <span>This is test message.</span> <a href="#">X</a>
</div>

Hope this helps

Advertisements
Categories: ASP.Net, Javascript, Jquery
  1. No comments yet.
  1. No trackbacks yet.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: