Assallamu'allaikum sobat blogger yang sering mampir kemari, mohon maaf nih sebelumnya saya jarang update postingan tutorial blog! akan t...
Assallamu'allaikum sobat blogger yang sering mampir kemari, mohon maaf nih sebelumnya saya jarang update postingan tutorial blog! akan tetapi kali ini saya ingin berbagi sedikit bumbu css dan jquery untuk sahabat yang ingin membuat loading di blog dengan mudah, cukup copy & paste pada tutorial berikut :
Langkah-2 : Simpan kode external jQuery library di bawah ini, tepat sebelum tag
Langkah-3 : Copy kode CSS di bawah ini, setelah itu paste tepat sebelum tag
Untuk demonstrasi bisa sobat lihat pada halaman blog ini, klik pada setiap artikel dalam blog ini untuk melihat tampilan demo nya! :)
Semoga artikel tentang Cara Menampilkan Loading di Blog paling Simple! yang saya buat ini bermanfaat bagi semua blogger yang membutuhkan!
Salam Blogger,
Langkah-langkah Pembuatan Loading di blog :
Langkah-1 : Login Blogger, Klik menu Template > Edit HTMLLangkah-2 : Simpan kode external jQuery library di bawah ini, tepat sebelum tag
</head> :<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'></script>Kode jQuery library hanya bisa di pasang 1x saja, jika sobat sudah memasang kode jQuery library lewati langkah ini, karena akan mengakibatkan konflik / semua kode jQuery tidak akan berfungsi.
Langkah-3 : Copy kode CSS di bawah ini, setelah itu paste tepat sebelum tag
</head> :Langkah-4 : Copy kode HTML di bawah ini, setelah itu paste tepat setelah tag<style>/* LOADING HALAMAN */#loadingHalaman {background:url(https://lh5.googleusercontent.com/-FjPBmaz4eZ0/VHPOQKFFodI/AAAAAAAAGA4/A64qYQ7YaMs/s1600/dark-loading.gif) no-repeat center;background-color:rgba(0, 0, 0, 0.32);width:100%;height:100%;position: fixed; left: 0px; top:0px; z-index: +100000;}</style>
<body> :<div id="loadingHalaman"></div></body> :Selesai!<script>//<![CDATA[//Loading Halaman$(window).bind("load", function() {$('#loadingHalaman').slideUp(1000);});//]]></script>
Untuk demonstrasi bisa sobat lihat pada halaman blog ini, klik pada setiap artikel dalam blog ini untuk melihat tampilan demo nya! :)
Semoga artikel tentang Cara Menampilkan Loading di Blog paling Simple! yang saya buat ini bermanfaat bagi semua blogger yang membutuhkan!
Salam Blogger,
COMMENTS