Animasi Gambar Muncul Dan Menghilang

S

ebagai contoh bisa anda lihat disini:DEMO
Cara pembuatan nya:
Cari kode: ]]></b:skin>
copas kode css dibawah ini dan letakkan di atas nya:

<style type="text/css"> .loader { text-align: center; } .loader span { display: inline-block; vertical-align:middle; width: 10px; height: 10px; margin: 0px auto; background: transparent; border-radius: 50px; -webkit-animation: loader 0.9s infinite alternate; -moz-animation: loader 0.9s infinite alternate; } .loader span:nth-of-type(2) { -webkit-animation-delay: 0.3s; -moz-animation-delay: 0.3s; } .loader span:nth-of-type(3) { -webkit-animation-delay: 0.6s; -moz-animation-delay: 0.6s; } @-webkit-keyframes loader { 0% { width: 10px; height: 10px; opacity: 0.9; -webkit-transform: translateY(0); } 100% { width: 24px; height: 24px; opacity: 0.1; -webkit-transform: translateY(-21px); } } @-moz-keyframes loader { 0% { width: 10px; height: 10px; opacity: 0.9; -moz-transform: translateY(0); } 100% { width: 24px; height: 24px; opacity: 0.1; -moz-transform: translateY(-21px); } } </style>

Contoh Penerapan nya:

<div class="loader">
<span style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img src="http://t0.gstatic.com/images?q=tbn:ANd9GcRB2wC9bvxCYyp1RRxmwYj8MDShs5IzcuMOUk2V6vXqKT7KXPjeloQ75ojv" /></span></div>

Selamat Mencoba