Stickybar Jquery
Sila lihat demo
Ia terletak di atas blog korang untuk memberitahu pengunjung tentang mesej penting,iklan atau update.Kemas dan menjimatkan ruang pada blog anda.
Langkah Pemasangan
Login ke blogger dashboard-->Klik Design-->Edit HTML
Hanya cari kod <body>
dan pastekan keseluruhan kod ini diBAWAHnya
<script src='http://code.jquery.com/jquery-latest.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){
$(".flip").click(function(){
$(".panel").slideToggle("slow");
});
});
</script>
<style type='text/css'>
div.panel
{
vertical-align: baseline;
letter-spacing: 1px;
padding:10px 10px 10px 20px;
background:#252636;
border:solid 1px #252636;
color:#fff;
-moz-border-radius:6px;
-webkit-border-radius:6px;
border-radius:6px;
width:100%;
margin:0px;
}
p.flip
{
FONT-FAMILY: Georgia, 'Times New Roman', arial, serif;
font-size:14px;
color:#fff;
padding:4px;
text-align:center;
background:#252636;
border:solid 1px #252636;
margin-bottom:1px;
width:100%;
}
div.panel a, p.flip a {
text-decoration:underline;
color:#fff;
}
div.panel a:hover, p.flip a:hover {
text-decoration:none;
color:#fff;
}
div.panel
{
height:auto;
display:none;
}
div.containerpanel {
z-index:9999;
margin-top:-55px;
margin-left:-20px;
padding:0px;
position:fixed;
width:100%;
}
</style>
<div class='containerpanel'>
<p class='flip'>KLIK MESEJ ▼</p>
<div class='panel'>
<p>Letak teks disini. Ini adalah kotak mesej</p>
</div>
</div>
Itu saja.Save template.
Post a Comment:
Nota: Hanya ahli blog ini sahaja yang boleh mencatat ulasan.