Hello sobat icloudZer kali ini admin bakalan memberikan informasi mengenai cara membuat animasi love muncul ketika diklik pada tampilan blog diblogger
Info: Baiklah sobat icloudZer jika kamu sudah penasaran dengan pembahasan kita kali ini yuk langsung aja kita bahas bersama sama
Disclaimer
Sebelum saya benar benar membahas mengenai bagaimana caranya memasang translate atau penerjemah diblog, saya akan memberikan disclaimer dulu bahwa setiap artikel yang kami tuliskan disini adalah murni tulisan admin, jadi jika kamu ingin mengcopy paste harap sertakan link sumber oke
Ketika kamu sedang membaca artikel disini kemudian ada penjelasan yang tidak kamu pahami kamu bisa menyampaikannya dikolom komentar oke agar admin bisa memperbaiki penulisan didalam artikel ini
Peringatan: Artikel ini khusus untuk orang yang paham aja, atau orang yang sedang memerlukan artikel seperti ini untuk pengetahuannya, bagi kamu yang tidak paham sama sekali menjauh aja karena mungkin disini mungkin bukan tempat kamu untuk mendapatkan informasi
Animasi Love
Pernahkan kamu menemukan sebuah blog ataupun website yang mana ketika suatu tampilan didalamnya diklik maka emoji love atau (hati) ini pun muncul secara random ataupun acak, dengan warna emoji love yang berbeda beda setiap kali user mengklik suatu tampilan didalam blog tersebut, nah jika kamu penasaran bagaimana cara memasang animasi emoji tersebut didalam blog kamu, harap bagi kamu membaca artikel ini hingga selesai agar tidak salah paham
Dibuat menggunakan Javascript
Pada biasanya setiap animasi yang admin jabarkan didalam blog icloudice ini dibuat menggunakan kode CSS, namun berbeda pada animasi love ini karena seluruh element pembuatannya dibuat menggunakan kode javascript sebagi kode source utamanya
Contoh Tampilan
Jika kamu penasaran bagaimana contoh tampilan dari animasi love atau hati tersebut, kamu bisa menggunakan tombol dibawah ini untuk melihatnya
Info: Bagaimana sobat dengan contoh tampilan nya keren bukan 😍, ya pastilah keren...karena dibuat dengan love hehehe
Cara pembuatan
Baiklah saatnya admin bakalan menjabarkan bagaimana caranya membuat animasi love muncul ketika diklik didalam blog diblogger
Kode Javascript
Caranya kamu bisa langsung aja menyalin kode javascript dibawah ini, kemudian kamu bisa meletakkannya dibawah kode <body>
<!-- Animasi love by icloudice.com || Original License -->
<script type='text/javascript'>
//<![CDATA[
!function(e,t,a){function n(){c(".heart{width: 10px;height: 10px;position: fixed;background: #f00;transform: rotate(45deg);-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);}.heart:after,.heart:before{content: '';width: inherit;height: inherit;background: inherit;border-radius: 50%;-webkit-border-radius: 50%;-moz-border-radius: 50%;position: fixed;}.heart:after{top: -5px;}.heart:before{left: -5px;}"),o(),r()}function r(){for(var e=0;e<d.length;e++)d[e].alpha<=0?(t.body.removeChild(d[e].el),d.splice(e,1)):(d[e].y--,d[e].scale+=.004,d[e].alpha-=.013,d[e].el.style.cssText="left:"+d[e].x+"px;top:"+d[e].y+"px;opacity:"+d[e].alpha+";transform:scale("+d[e].scale+","+d[e].scale+") rotate(45deg);background:"+d[e].color+";z-index:99999");requestAnimationFrame(r)}function o(){var t="function"==typeof e.onclick&&e.onclick;e.onclick=function(e){t&&t(),i(e)}}function i(e){var a=t.createElement("div");a.className="heart",d.push({el:a,x:e.clientX-5,y:e.clientY-5,scale:1,alpha:1,color:s()}),t.body.appendChild(a)}function c(e){var a=t.createElement("style");a.type="text/css";try{a.appendChild(t.createTextNode(e))}catch(t){a.styleSheet.cssText=e}t.getElementsByTagName("head")[0].appendChild(a)}function s(){return"rgb("+~~(255*Math.random())+","+~~(255*Math.random())+","+~~(255*Math.random())+")"}var d=[];e.requestAnimationFrame=function(){return e.requestAnimationFrame||e.webkitRequestAnimationFrame||e.mozRequestAnimationFrame||e.oRequestAnimationFrame||e.msRequestAnimationFrame||function(e){setTimeout(e,1e3/60)}}(),n()}(window,document);
//]]>
</script>Info: Jika sudah kamu bisa langsung menyimpan template kamu, kemudian periksa apakah animasi love tersebut sudah terpasang secara sempurna
