Membuat efek loading blur pada gambar di blogger
Hello sobat ICloudzer kali ini admin bakalan menjabarkan mengenai cara membuat efek loading blur pada gambar di blogger
Info: Jika kamu pemasaran dengan pembahasan kita kali ini yuk langsung aja kita bahas bersama sama
Efek blur
Pada artikel sebelumnya admin sudah membahas bagaimana cara nya menampilkan efek preloader blur saat diklik di blogger, kamu bisa mempelajari lebih lanjut disini, dan sekarang admin bakalan menjelaskan bagaimana caranya membuat efek loading blur pada gambar di blogger dengan tampilan yang sudah pasti keren
Cara kerja
Cara kerja dari tampilan efek blur tersebut hanya akan muncul setiap kali halaman blog di refresh alias di muat ulang, dan berfungsi hanya pada gambar yang di tampilkan di dalam blog
Khusus gambar
Seperti yang sudah admin jabarkan sebelumnya bahwa efek blur tersebut berfungsi secara khusus pada gambar, jadi secara otomatis setiap element img akan menampilkan efek blur tersebut
Contoh tampilan
Jika kamu penasaran dengan contoh tampilan dari efek loading blur di blogger, silahkan refresh halaman yang sedang kami baca ini, kemudian periksa setiap gambar di dalam blog ini, kemudian tampilan dari efek blur pada gambar akan muncul
Info: Bgaiamana sobat dengan contoh tampilan nya keren sekai yak
Cara pembuatan
Baiklah sobat ICloudzer sekarang saatnya admin bakalan menjabarkan msngenai cara membuat efek loading blur pada gambar, silahkan. baca dan pelajari artikel ini hingga selesai ok
Kode CSS
Langkah pertama seperti biasa silahkan salin kode CSS di bawah ini kemudian lstakkan di atas kode ]]></b:skin>
body.rah img{-webkit-filter:blur(14px);filter:blur(14px)}
Info: Atau sobat bisa menaruh kode CSS di atas mebggunakan tah kode <style>
Kode Javascript
Langkah selanjutnya silahkan salin lagi kode javascript di bawah ini kemudian letakkan di bawah kode <body> atau di atas kode </body>
<script>/*<![CDATA[*/
eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('j 8=["\\r\\c\\a\\k","\\s\\t\\9\\d\\k\\u\\9\\l\\9\\m\\b\\c\\d","\\d\\e\\v","\\e\\a\\a","\\m\\l\\e\\f\\f\\h\\n\\f\\b","\\w\\x\\y\\z\\c\\g\\b\\9\\g\\b\\h\\c\\e\\a\\9\\a","\\d\\9\\A\\c\\o\\9","\\e\\a\\a\\B\\o\\9\\g\\b\\h\\n\\f\\b\\9\\g\\9\\d"];j i=p[8[1]](8[0]);i[8[4]][8[3]](8[2]);p[8[7]](8[5],q(){C(q(){i[8[4]][8[6]](8[2])},D)})',40,40,'||||||||_0x2872|x65|x64|x74|x6F|x72|x61|x73|x6E|x4C|rahLzyI|var|x79|x6C|x63|x69|x76|document|function|x62|x71|x75|x53|x68|x44|x4F|x4D|x43|x6D|x45|setTimeout|5300'.split('|'),0,{}))
/*]]>*/</script>
Info: Kode javascript di atas sudah admin enkripsi secara sederhana, so sobat jangan mengedit ataupun mengubah kode yang admin berikan tersebut
Penjelasan
Setelah menerapkan dan memasang kode yang admin berikan di atas nanti secara otomatis, setiap gambar di dalam blog kamu akan menampilkan efek blur saat proses loading blog di jalankan, semoga bermanfaat