1. Login blog -> Template.
2. Edit HTML -> Lanjutkan.
3. Centang expand template widget -> gunakan ctrl dan f.
4. Cari kode ]]></b:skin> -> Letakan kode CSS dibawah ini diatasnya.
#mbt_bar{
background:#333 url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgOetmRQo1flAKB5c2N3BjvBsvIt6Ri8Wc4uR5QgtIN733wedZXGkHX1uHDQTvtCWTZeidaqK255VS9iklhp3h7YC-lqAgQdYhmnboxNn2z84n2kgRy0HJZe2qrbPqBk2mnb9irV3ZLbHg/s400/stickybar.png') repeat-x;width:100%;margin:0 auto;text-align:center;padding:0px 0;border-bottom: 1px solid #888888;-moz-box-shadow: #666666 0px 1px 3px;-webkit-box-shadow: #666666 0px 1px 3px;box-shadow: #666666 0px 1px 3px;z-index: 999;height: 28px; position:fixed;line-height: 1.85em;vertical-align: baseline;letter-spacing: 1px;color:#fff;font-size:13px;font-weight:bold;font-family: arial,"Helvetica",sans-serif;}#mbt_bar a{text-decoration:underline;color:#E2E504;}#mbt_bar a:hover{text-decoration:none;}#mbt_bar p {margin:0; list-style:none;}#mbt_bar img {vertical-align: middle;margin-right: 6px;}
5. Taruh kode berikut diatas tag </head>.
<script type='text/javascript'>6. Cari lagi, kode <body>. Untuk kode kali ini, gak perlu deh agan cari menggunakan Ctrl dan f. Cukup dengan scroll halaman ke bawah, sampai pucuk. Sudah ketemu? letakkan kode berikut dibawahnya ya.
//<![CDATA[var mbt_arr = new Array();var mbt_clear = new Array();function mbtFloat(mbt) {mbt_arr[mbt_arr.length] = this;var mbtpointer = eval(mbt_arr.length-1);this.pagetop = 0;this.cmode = (document.compatMode && document.compatMode!="BackCompat") ? document.documentElement : document.body;this.mbtsrc = document.all? document.all[mbt] : document.getElementById(mbt);this.mbtsrc.height = this.mbtsrc.offsetHeight;this.mbtheight = this.cmode.clientHeight;this.mbtoffset = mbtGetOffsetY(mbt_arr[mbtpointer]);var mbtbar = 'mbt_clear['+mbtpointer+'] = setInterval("mbtFloatInit(mbt_arr['+mbtpointer+'])",1);';mbtbar = mbtbar;eval(mbtbar);}function mbtGetOffsetY(mbt) {var mtaTotOffset = parseInt(mbt.mbtsrc.offsetTop);var parentOffset = mbt.mbtsrc.offsetParent;while ( parentOffset != null ) {mbtTotOffset += parentOffset.offsetTop;parentOffset = parentOffset.offsetParent;}return mbtTotOffset;}function mbtFloatInit(mbt) {mbt.pagetop = mbt.cmode.scrollTop;mbt.mbtsrc.style.top = mbt.pagetop - mbt.mbtoffset + "px";}function closeTopAds() {document.getElementById("mbt_bar").style.visibility = "hidden";}//]]></script>
<div id='mbt_bar'> INGIN MENJADI PENULIS TAMU DI BLOG INI ?
<a href='http://infoiki.blogspot.com/p/buku tamu'>KLIK DISINI</a><span style='padding:0px; float:right'><img align='absmiddle' border='0' onClick='closeTopAds();return false;' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1lRlb7r0an5Vq3NdjDeGM35qjK4tF1jtKmBi8E_TNU-S7YWJkHRFe-XbOPsgPRDfobK9ssGBYwLorcqPW1GlZwMIZ_8RYHACmDMxmd3JQ1AL-jE0vQ7pwxdflFSp79eXjWHrSP_sfMWY/s400/cancel.png' style='cursor:hand;cursor:pointer;'/></span></div><br/><br/>
7. Save & Liat hasilnya!
Comments :
0 komentar to “ Membuat sticky bar sendiri dengan tombol close blogger ”
Posting Komentar
Aturan Berkomentar
1. No spam!
2. No live link!
3. No maho :D