Cara Membuat Efek Loading Halaman Pada Blog

Written By naufal aulia on Sabtu, 16 Juni 2012 | Sabtu, Juni 16, 2012


kembali lagi dengan artikel tentang dunia blogging, kal ini saya akan membongkar rahasia membahas cara membuat efek loading page di blog, jadi jika pengunjung blog kita sedang membuka blog kita pasti-kan memakai loading, dengan memakai trik ini efek loading blog kita jadi lebih menarik. sebagai contoh silakan buka web demo ini . nah.. begitulah maksud dari trik ini.. bagi yang berminat langsung ikuti tutorial dibawah ini 

Cara Membuat Efek Loading Halaman Pada Blog
  • loggin ke blog kalian
  • buka menu rancangan --> pilih menu edit HTML
  • lalu cari kode  </head>
  • lalu letakkan kode dibawah ini, tepat diatas kode  </head>
<!-- Loading Page Script – nofal-sama77 – http://nofal-sama77.blogspot.com -->
<style type="text/css">
/* add loading image */
body {
background:#4B4B4B url(http://i1226.photobucket.com/albums/ee408/nofal-sama77/loading.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("style");
css.innerHTML=classORid+"{"+rules+"}"
document.body.appendChild(css);
}
catch(e){}
try{
document.styleSheets[document.styleSheets.length-1].addRule(classORid,rules);
}
catch(e){}
}
function loaded(){
css("#page","display:block!important");
css("body","background:#000 url()");
}
if(window.addEventListener)window.addEventListener("load",loaded,false);
else if(window.attachEvent)window.attachEvent("onload",loaded);
else if(document.getElementById)window.onload=loaded;
</script>


  • lalu cari kode  <body>
  • lalu letakkan kode dibawah ini, tepat dibawah kode  <body>
    <div id="page">


  • cari lagi kode  </body>  
  • lalu taruh kode  </div>  diatas kode  </body>  
  • lalu save dehhhh
---selesai--- semoga bermanfaat HAppY BLOGging :)

Ditulis Oleh : naufal aulia ~nofal-sama77

Muh.Akram Anda sedang membaca artikel berjudul Cara Membuat Efek Loading Halaman Pada Blog yang ditulis oleh nofal-sama77 Dan Maaf, Anda tidak diperbolehkan mengcopy paste artikel ini.

Blog, Updated at: Sabtu, Juni 16, 2012

6 comments:

  1. tag ^body^ ning edit html ku raono

    BalasHapus
  2. ilham@ pastikan anda centang expand widget template

    BalasHapus
  3. tetep wae ora ono menurutku blog itu tidak mempunyai tag ^body^. biasane ning dokumen html seharuse tag ^body^ ning ngisore tag ^/head^

    BalasHapus
  4. oke bgt ni trik... lmayan nmbah cntik blog gwe

    BalasHapus
  5. i hope it will be more usefull

    BalasHapus