Cara Membuat Efek Loading di Blog Keren
Cara Membuat Efek Loading di Blog Keren - Halo sobat, kali ini kami akan membagikan sebuah kode script buat blog agan biar tampilan nya tambah cetarrrrrr hehe,.
Efek loading ini katanya sih sangat melekat dengan sebuah web, yaitu web nya kang ismet, siapa sih yang gak kenal kang ismet, salah satu master blogger yang ada di indonesia, efek ini sendiri mungkin udah banyak di google tapi gak apa - apa lah ane re-share, biar yang belum dapat bisa kebagian juga hehe :D
Ok deh tanpa banyak basi lagi untuk yang mau membuat atau memasang efek ini do blog nya silahkan ikuti step by step nya di bawah ini :
- Masuk dulu ke blogger
- Pilih Template --> Edit Html
- Taruh Kode Dibawah ini diatas kode </style> atau ]]></b:skin>
#page-loader { position:fixed !important; position:absolute; top:0; right:0; bottom:0; left:0; z-index:999999; background: #303030 url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9rApiGe1vXwx_x9WIFm7cJ7-ydH4UjAW94PWPieNq186dwSPvmKt2AsT8F_TVN09Tj4xCQSHvabvaA5TyaAn_y3LH5gqUO7bdJxS2QTihNo8N2Fk_SVJg_7LidEGL8JvNUEXfK898X3w/s200/load6.gif") no-repeat 50% 50%; padding:1em 1.2em; display:none }
- Masukkan kode dibawah ini diatas kode </head>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js' type='text/javascript'/>
- Masukkan kode dibawah ini diatas kode </body>
<script type='text/javascript'> //<![CDATA[ // Menyisipkan markup tabir animasi $(document.body).append('<div id="page-loader"></div>'); // Saat halaman aktif terpicu untuk berpindah/ keluar menuju halaman lain... $(window).on("beforeunload", function() { // ... tampilkan tabir animasi dengan efek `.fadeIn()` $('#page-loader').fadeIn(1000).delay(6000).fadeOut(1000); }); //]]> </script>
- Dan yang terakhir klik Save
Ok gimana menurut kalian cukup mudah bukan untuk menambahkan nya ke blog agan, mungkin cukup sekian artikel kali ini yang membahas tentang Cara Membuat Efek Loading di Blog Keren jangan lupa komentar nya yah gan dan Terima kasih.
_- gimana mau coba trik ini, kalo agan protect tulisannya
ReplyDeleteoke sudah diperbaiki gan, maap atas ketidak nyamanannya :D
DeleteTerima kasih infonya Gan.
ReplyDeletesilakan kunjungi blog http://rebornandblossom.blogspot.co.id/ untuk mendapatkan informasi mengenai motivasi dan inspirasi kehidupan. :)