Senin, 14 Februari 2011

Valentine CSS3 Spinning

Perkembangan CSS semakin hari semakin meningkat. CSS3 dengan variabel kodenya bisa menghasilkan tampilan yang memikau pada browsingan. Dari kata menjadi berbalik (rotate), membuat bayangan tanpa gambar, dan lain-lain. Mengingat aktifitas CSS3 ini belom sepenuhnya didukung browsingan, sobat bisa lihat disini CSS Activities, untuk pacuan dan informasinya. Di hari valentine (berlaku bagi negara yg notabene tak pernah merasakan kesengsaraan berkepanjangan) ini cocok banget nih kita memakai trik CSS3 untuk menambah gaya penampilan pada blog tercinta :D

CSS drop-shadows without images.

Membuat bayangan disekitar pinggiran kotak/image murni menggunakan CSS.

CSS Rotation

Membuat efek berputar tulisan/gambar sebagai hasilnya.
VALENTINE DAY
-webkit-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
Jika sudah mahir bisa dikombinasikan dengan jQuery script, dan menghasilkan karya dengan nama spinning :)

Bagus kan efek spinning, dari acak kadut putar gak karuan pas disorot sama mouse bisa menjadi rapih dan terlihat jelas :-/ Trik ini bisa dipakai pada photo (avatar) pada kolom komentar blogspot Pasang efek spinning pada comment avatar blogspot.

Efek dan style sudah ada, tinggal template valentinenya nih sama Beben si bloglang anu ganteng kalem tea belom dibagi :P

  • Menu fixed up transparant setelah disorot ada efek warna hitam gelap.
  • Background image slider (gambar background bisa berganti-ganti) karya WebDevTuts.
  • Fixed fade out menu karya dari Tympanus.
valentine
Bye bye :-h

Tidak ada komentar:

Posting Komentar