0
/*----------Begin TechTasks Message Box CSS--------------*/
#TT_float_box_top {
background: none repeat scroll 0 0 #E1F0FF;
border: 1px solid #0080FF;
border-radius: 0 0 20px 20px;
font-weight: bold;
padding: 1px;
position: absolute;
text-align: center;
top: 0;
width: 99%;
left: 5px;
right: 5px;
}
#TT_close_box_t
{
float:right;
cursor:pointer;
padding: 10px 10px 0px 0px;
}
/*----------End TechTasks Message Box CSS--------------*/
Step 2:Find </head> .
Cope and paste the below just before </head> this.
<script src='http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.4.4.js' type='text/javascript'/>
<script type='text/javascript'>
/*----------Start TechTasks Message Box Script--------------*/
$(document).ready(function()
{
$(window).scroll(function()
{
$('#TT_float_box_top').animate({top:$(window).scrollTop()+"px" },{queue: false, duration: 350});
});
$('#TT_close_box_t').click(function()
{
$('#TT_float_box_top').animate({ top:"+=15px",opacity:0 }, "slow");
});
});
/*----------End TechTasks Message Box Script--------------*/
</script>
Step 3:Finally find the </body>
Now copy and paste below code just above the </body>.
<div id='TT_float_box_top'>
Your Msg Goes Here
<img id='TT_close_box_t' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNpSh7vaVRjE2lCiTPmUas3Co5Gqwys1eKPGlAygVqPdfS1qFDw32raxRk9MgxGPI_icNyee3ZsG7khDS4ZPvMVte0_O4jyYhGyQ-ydXFQ2j9EHdtJ_DitCr-Lal-TJLZhyehaPIDCRdE/s288/DeleteRed.png'/>
</div>
So thanks for viewing and please comment !!
Tags:
Blogger
How to make announcements to your blogger blog
Hi guys
Have u ever wanted to make some important announcements like a post that is very important ?
Well it is possible in a closeable-jquery-floating-message-box
This is also closeable
So this is from techtasks.net
So the post is from it i would like to thank him
so
Here is what u have to do
Step 1:Login to Blogger dashboard » layout » Edit HTML
Find(CTRL+F) ]]</b:skin>tag.
Now copy and paste below code just before ]]</b:skin> this.
/*----------Begin TechTasks Message Box CSS--------------*/
#TT_float_box_top {
background: none repeat scroll 0 0 #E1F0FF;
border: 1px solid #0080FF;
border-radius: 0 0 20px 20px;
font-weight: bold;
padding: 1px;
position: absolute;
text-align: center;
top: 0;
width: 99%;
left: 5px;
right: 5px;
}
#TT_close_box_t
{
float:right;
cursor:pointer;
padding: 10px 10px 0px 0px;
}
/*----------End TechTasks Message Box CSS--------------*/
Step 2:Find </head> .
Cope and paste the below just before </head> this.
<script src='http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.4.4.js' type='text/javascript'/>
<script type='text/javascript'>
/*----------Start TechTasks Message Box Script--------------*/
$(document).ready(function()
{
$(window).scroll(function()
{
$('#TT_float_box_top').animate({top:$(window).scrollTop()+"px" },{queue: false, duration: 350});
});
$('#TT_close_box_t').click(function()
{
$('#TT_float_box_top').animate({ top:"+=15px",opacity:0 }, "slow");
});
});
/*----------End TechTasks Message Box Script--------------*/
</script>
Step 3:Finally find the </body>
Now copy and paste below code just above the </body>.
<div id='TT_float_box_top'>
Your Msg Goes Here
<img id='TT_close_box_t' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNpSh7vaVRjE2lCiTPmUas3Co5Gqwys1eKPGlAygVqPdfS1qFDw32raxRk9MgxGPI_icNyee3ZsG7khDS4ZPvMVte0_O4jyYhGyQ-ydXFQ2j9EHdtJ_DitCr-Lal-TJLZhyehaPIDCRdE/s288/DeleteRed.png'/>
</div>
So thanks for viewing and please comment !!
Subscribe To Get FREE Tutorials!
Tags:
Blogger
Subscribe to:
Post Comments (Atom)
Share your views...
0 Respones to "How to make announcements to your blogger blog"
Post a Comment