Cara Membuat Efek Loading di Blog Terbaru 2015



Salam Blogger . .

Dalam kesempatan ini admin akan share bagaimana cara Cara Membuat Efek Loading di Blog .

Keunggulan Efek Loading Di Blog  adalah membuat blog anda agar lebih menarik dan keren ,

Karena Efek Loading Di Blog blog anda justru terlihat lebih ringan loading nya karena ada selipan animasi Loading Itu sendiri . .

Banyak para Blogger yang mencari tutorial ini untuk di pasang di blog mereka supaya lebih menarik dan pengunjung blog pun Meresa lebih nyaman dengan Efek Loading Blog ini karena terlihat keren dan tentunya tidak mengganggu bagi pengunjung blog .

oke langsung saja

simak baik baik  Cara Membuat Efek Loading di Blog

pertama simpan kode jquery di bawah ini diatas kode </head>

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js' type='text/javascript'/>

kedua tambahkan kode css di bawah ini di atas ]]></b:skin


#page-loader {
position:fixed !important;
position:absolute;
top:0;
right:0;
bottom:0;
left:0;
z-index:9999;
background:#000 url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjxAEInBdLQnh71bI2n1pQcpfXbMvz9exdL02aAZl4frvEN3aVhEZ20d4TGVdiGfP6okELUT7AkKrHARM57EA3o87HjrhqZjnRYE1pe-4DngKPqguQu7KQKBmoKcnbJgFaTjY_ZEvMkgAk/s200/load6.gif') no-repeat 50% 50%;
color:white;
padding:1em 1.2em;
display:none;
}

ketiga tambahkan Java Script di bawah ini diatas </body>


<script type='text/javascript'>
//<![CDATA[

$(document.body).append('<div id="page-loader"></div>');

$(window).on("beforeunload", function() {

    $('#page-loader').fadeIn(1000).delay(6000).fadeOut(1000);
});

//]]>

</script>



Keterangan : 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjxAEInBdLQnh71bI2n1pQcpfXbMvz9exdL02aAZl4frvEN3aVhEZ20d4TGVdiGfP6okELUT7AkKrHARM57EA3o87HjrhqZjnRYE1pe-4DngKPqguQu7KQKBmoKcnbJgFaTjY_ZEvMkgAk/s200/load6.gif
 bisa anda ganti dengan kode di bawah ini.





 
animasi blog



https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8M3w7hyphenhyphenr-nB6klqAdSYQDszA0jzCxrfQrPbPDTEPM4jsCHK83UcFFEfSDdwXU-5Y9dYewCG2GA6S-E1faqKAnrqeZPszoU_b4vZngNqC9rFCfhfD22IalcYZgeccamjp0ehGKS8ebjgyZ/s1600/loading1.gif

animasi blog


https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh2kLKNEXmEQE5RQ2Q7c9miukN2QR3rkcmPf5VPeacV3-NYSOlX5VemB5M8RmsjrxCtR8sGt_nVpixrj70SXWg5HrKLXC5c9Ou_ntRdAGMZmkh9wgEmUWpQv0wKy_iZvP_v8X7vvb2aog3g/s1600/loading2.gif

animasi blog


https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhY4Ee00g0aazPcsiiUow_UVtWfCohZ1O_7SBweztX0NXvTVO_kzQfM19SMa0pKs3hROpA_XfXUM5-NfQDpsH47LMWamZlckvtHmvw-cj5zhzL0Lvnxr3bxP2Ucplc9YOTZRQuEgE6IrDm6/s1600/loading3.gif

animasi blog



https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEilUOXC89aZOyqljX2Pgv9M_Q_auRWdmxtZpfeLqsarCjGhG9kRsGHl6ReF-6etxaH__RtCGaT2CjAS6DMooZZM7NBy5NTPu7X3hmotKkwvRemDBSQjH_YMx0x0b8XBhHLHqiv-XiEfo6n3/s1600/loading4.gif

animasi blog


https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-Hmx44i8gzCf98eQbVQCEbyyuVvw2_6flYLEXLiB-6oyC8cFhozJueprt68qFXNwn2felE3XUeKjMt_UW1Y4jrDSNhWMnaZ3t3GTf80SXpMxxY_TlLno3aOv9DTFjQb3qIezTeSCvYGYe/s1600/loading5.gif

animasi blog


https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhWt8D94qyBIWAZ7dAqaXT4hlYp96jkebVnI2k4XxU5I6xaA3E-A0KrqB23hg7Ia-D1zeAMDDdWwZYWckkdAx0L38KsdcFvmforYwT0X8Ok7OOpIcEzMjyIWcZ8tLSAISDgMdIJCj1eSJqb/s1600/loading6.gif

animasi blog



https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiK9Htcl2DsK-NBi2C3GT4GgOmFppu1vl62q3hhdroeviDV4Nre61HcyBant2GePo4Z7waOGcgDAqXMDVOrScKd71ahEaYAYsUbH_jtM-yrUF3mfFHyiVQkLcScEhLO90y821L4TS8ylJIg/s1600/loading7.gif


oke sekian dulu tutorial dari admin semoga bermanfaat . . .


jangan lupa klik like pada fanspage untuk mendapakan update terbaru Blog Kenyut .


jika ada yang ingin di tanyakan silahkan tanya di tempat yang sudah di sediakan . . 


0 Response to "Cara Membuat Efek Loading di Blog Terbaru 2015"

Post a Comment

Silakan tinggalkan komentar ngawur sobat