Membuat Loading Page Blogger

salam sobat blogger,.

kali ini kita akan coba menambahkan loading screen pada blogg. seperti biasa, trik ini sya dapat dari sobat blogger "Rainboow", dan bukan hasil temuan sya sendiri. maklum, NEWBIE. ha ha ha...

berikut langkah-langkah yang harus di persiapkan dan dilakukan :




Login Blog
Buke Menu rancangan >> edit HTML
Lalu cari kode </head>
Dan letakkan kode dibawah ini tepat diatas kode </head>

<style type='text/css'>
/* add loading image */
body {
background:#000000 url(http://i383.photobucket.com/albums/oo271/stone608/Gif/loading-1.gif) no-repeat fixed center;
}
/* hide page div */
#page{
display:none;
}
</style>
<script type='text/javascript'>
function css(classORid,rules){
try{
var css=document.createElement(&quot;style&quot;);
css.innerHTML=classORid+&quot;{&quot;+rules+&quot;}&quot;
document.body.appendChild(css);
}
catch(e){}
try{
document.styleSheets[document.styleSheets.length-1].addRule(classORid,rules);
}
catch(e){}
}
function loaded(){
css(&quot;#page&quot;,&quot;display:block!important&quot;);
css(&quot;body&quot;,&quot;background:#000 url()&quot;);
}
if(window.addEventListener)window.addEventListener(&quot;load&quot;,loaded,false);
else if(window.attachEvent)window.attachEvent(&quot;onload&quot;,loaded);
else if(document.getElementById)window.onload=loaded;
</script>

Lalu cari kode <body>
Lalu letakkan kode dibawah ini dibawah kode diatas :
<div id='page'>
Dan taruh kode </div> diatas kode </body>
Save Template 
Penjelasan Tulisan Yang Berwarna Merah URL Link Anda Bisa Diganti , Dan Yang Berwarna Kuning Background Warna Belakang Dari Loading Page Anda Sekian Cara Memberi Efek Loading Di Page.


Sumber :  http://www.mrrainboow-xp.com
Read More..

Membuat Tooltips Blogger


Membuat Tooltips sedikit agak berbeda dari Tampilan Standard Bloger, agar terlihat menarik dan ga bosen di pandang.
ha ha ha.....

ni ane dapet dari sobat "rainboow", silahkan di praktekan sendiri ya. asal benar langkahnya, pasti pas.
berikut langkah" nya.:

Login Di Blogger.com
Follow Blog Saya juga boleh
Masukan Rancangan >> Edit HTML
Jangan Lupa Klik Expand Widget ya !!
Cari Code <body> Paste kan Code dibawahnya

<script src='http://javascript-share.googlecode.com/files/wb.js'/><a href='http://www.warungbebas.com/' id='wb_ttauth'/><script type='text/javascript'>//<![CDATA[
wb.tooltip_setting =
{
func : "Tooltip",
top : 5,
left : 5,
maxw : 300,
speed : 20,
timer : 40,
endalpha : 95,
alpha : 0,
style_plus : "#tt{border:2px double #FF0000;background:#000000;-moz-border-radius: 10px;border-radius:10px;}#ttcont{background:#000000;color:#ffffff;-moz-border-radius: 5px;border-radius: 5px;}"};
//]]></script><script src='http://javascript-share.googlecode.com/files/wb_tooltips.js'/><script src='http://javascript-share.googlecode.com/files/wb_autotooltips.js'/><!-- pembuka warungbebasautotooltip --><div id='warungbebasautotooltip'>

Selesai dengan code diatas ?
lalu cari </body> paste kan code berikut di atas nya

</div><!-- penutup warungbebasautotooltip --><script type='text/javascript'>wb.$_auto_tooltip(&#39;warungbebasautotooltip&#39;);</script>

Keterangan :
Warna Merah Garis Luar Box Warna Hijau Background Belakang dari Text Warna Biru Code Tulisan
Sekian Dari Saya Jika Berguna Boleh Follow Tinggalkan Comments


Read More..

E-book Linux

Read More..

Perkenalan Blog

Hanya Sebatas Percobaan...!!!
Read More..
 
Like Me on Facebook
Follow Me on Twitter
My Google Plus
Langganan Artikel via RSS