Just add the following jquery,
$(document).ready(function() {
var $alertdiv = $('<div id = "alertmsg"/>');
$alertdiv.text("Welcome to twitter");
$alertdiv.bind('click', function() {
$(this).slideUp(200);
});
$(document.body).append($alertdiv);
$("#alertmsg").slideDown("slow");
setTimeout(function() { $alertdiv.slideUp(200) }, 3000);
});
var $alertdiv = $('<div id = "alertmsg"/>');
$alertdiv.text("Welcome to twitter");
$alertdiv.bind('click', function() {
$(this).slideUp(200);
});
$(document.body).append($alertdiv);
$("#alertmsg").slideDown("slow");
setTimeout(function() { $alertdiv.slideUp(200) }, 3000);
});
Css:
#alertmsg
{
font-family:Arial,Helvetica,sans-serif;
font-size:135%;
font-weight:bold;
overflow: hidden;
width: 100%;
text-align: center;
position: absolute;
top: 0;
left: 0;
background-color: #333F31;
height: 20;
color: #F3FDED;
font: 20px/40px arial, sans-serif;
opacity: .9;
display:none;
}
{
font-family:Arial,Helvetica,sans-serif;
font-size:135%;
font-weight:bold;
overflow: hidden;
width: 100%;
text-align: center;
position: absolute;
top: 0;
left: 0;
background-color: #333F31;
height: 20;
color: #F3FDED;
font: 20px/40px arial, sans-serif;
opacity: .9;
display:none;
}
Not too shabby... I used some different CSS to get the style more like twitter...
ReplyDeletewidth:100%;
position:fixed;
top:0;
left:0;
z-index:32768;
background-color:#efefef;
font-size:18px;
color:#000;
text-align:center;
font-family: inherit;
padding:20px 0px;
border-bottom:1px solid #bbb;
cursor: pointer;
overflow: hidden;
opacity: .9;
display:none;
Thanks both Pandiya and Anonymous. I like the css in the comment
ReplyDeletenice article i'll added this up on my site
ReplyDeletehttp://ran.pdf-games.com
It works good for me :)
ReplyDeleteSEO Training Pakistan
great bar using jquery, it's what I want really.
ReplyDeleteIt seems to be good for me :)
ReplyDeleteSEO Services Pakistan
Softicweb.com is the best web Developing company in Pakistan. Softicweb provides web design,web development and seo in very
ReplyDeleteaffordable price.www.softicweb.com
Thanks both Pandiya and Anonymous. I like the css in the comment
ReplyDeletedigital marketing training in dhaka
Computer courses in Lahore and training are a great way to learn and advance in career and I think more people should move towards it
ReplyDeleteComputer Education is a very common and easy way to make money online or office a related job. MS Office course is the main course it is all documentation concepts are complete when completing this course. Data Entry jobs are relevant to this course. Genuine Tech
ReplyDeletehere are some of the best trainer in lahore
ReplyDeleteComputer Foundation
English Typing Course
Urdu Typing Course
Graphic Designing
Freelancing training course
Social Media Marketing
AutoCAD 2D/3D Drawing
Content Writing course and start freelancing
WordPress Development
The Version Soccer Jersey reflects innovation and style, embodying the spirit of the game with its sleek design and performance-oriented features
ReplyDeleteScored myself a ronaldo jersey
ReplyDelete– ready to represent my favorite player on and off the pitch!
this is very informative blog
ReplyDelete