Rabu, 08 Agustus 2012

Micro Script and Micro Trick CSS

Karena bukan suatu hal yang harus di bahas, list link para kreasi JavaScript berukuran kecil (micro js) berikut, mungkin bisa menjadi bahan mengisi waktu luang kita di bulan puasa. Lumayan sudah pada opensource dan dihostingkan di github.com :d Tinggal dipilih-pilih saja script yg terpakai oleh kalian di sana :))
Pelangi² alangkah indahmu merah kuning hijau di langit yang biru ...
pelukismu agung, siapa gerangan??? Pelangi² ciptaan Tuhan.
Silahkan menuju ke halaman berikut guna melihat-lihat alakadar Microjs Bonusnya trik membuat full stylish effect image ;)) Membikin effect zoom pada gambar memakai attribute scale, proses akhir kerja yakni dengan cara di klik dan ditahan pada mouse :-/

DEMO

   
Kode CSS.photos {
-webkit-box-shadow: 0 0 5px rgba(0,0,0,.25);
-moz-box-shadow: 0 0 5px black;
-o-box-shadow: 0 0 5px black;
box-shadow: 0 0 5px black;
-webkit-transition: all 0.5s ease-in;
-moz-transition: all 0.5s ease-in;
-o-transition: all 0.5s ease-in;
transition: all 0.5s ease-in;
}
.photos:active {
left: 425px;
top: 225px;
position: relative;
-webkit-transform: rotate(720deg) scale(3.5);
-moz-transform: rotate(720deg) scale(3.5);
transform: rotate(720deg) scale(3.5);
-webkit-box-shadow: 15px 15px 20px rgba(0, 0, 0, 0.6);
-moz-box-shadow: 15px 15px 20px rgba(0, 0, 0, 0.6);
box-shadow: 15px 15px 20px rgba(0, 0, 0, 0.6);
z-index: 10;
}
MarkUp HTML<img class="photos" src="YOUR-IMAGE-HERE" alt="" />http://seuratjs.com/
Happy blogging \m/

Tidak ada komentar:

Posting Komentar