◄ Min  Size Fonts: + | - | ± Color: Max ►

Trick Display Image with Fancy Coded

Lagi-lagi trick seputaran image hadir kembali menggebrak dunia persilatan. Entah sudah berapa banyak artikel mengenai trik gambar aku bagi buat sobat sekalian. Dari tutorial ringan membuat efek pada image dengan border, effect television for image, transform effect for image galery, apa mau seperti efek rgba tint effect for image... Kalau disebutin satu-satu gak bakalan habis satu halaman postingan :D Jadi Beben Koben si bloglang anu ganteng kalem tea punya cerita sekarang, asal-muasal gebrakan trik gambar sekarang diawali ketika menclok ke make simple image gallery using only CSS and the :target selector!
Dari membaca artikel tersebut menemukan satu web berkebangsaan perancis, dimana kontennya berisi artikel sekitaran dunia CSS3! Sampai menu bergaya lavalamp dibikin memakai CSS 3 ^:)^

CSS3 Create nama web itu sobat. Indah webnya sob, adem ngeliatnya :x Karena demonya lumayan memakan tempat, maka dibeginikan saja penempatannya ;) :D Hover/sorot pada gambarnya ya

Click to look DEMO
30 degrees X and 10 degrees Y:
negatively 20 degrees X and 15 degrees Y:
30 degrees X:
10 degrees Y:


Original article you can read here my bro skewing web page elements using the css3 skew transform. Penjelasan dan kode sudah cukup jelas. Yang sobat perlu perhatikan adalah penulisan markup HTML (syntax image)!<img src="http://LINK-YOUR-IMAGE.jpg" alt="" class="skewer" onmouseover="this.className='skewer skewed'" onmouseout="this.className='skewer'" />Beres satu, masih ada lagi dong trick image lain full stylish :)) Tidak tanggung datang dari web panutan Smashing Coding. Karena lumayan banyak demo yg akan kalian lihat, Koben sengaja buatkan halaman khusus di blog keren aku yg lain :"> Demo CSS 3D Transforms. Disini kalian bisa melihat penjelasan & kode² nya ;)) Adventures In The Third Dimension: CSS 3D Transforms
Happy trick image \m/
Loading...
XTrick Display Image with Fancy Coded

Subscribe my posts Register For Free!

4 comments

[?] g+ convert

DO NOT EVEN TRY ADD LINK [-X
You can use some HTML tags, such as
<b> - <i> - <a> - http://...jpg/gif/png/bmp - http://youtu.be/...


MISC

Resources

WANT BE HERE!!! CONTACT ME :P

FACEBOOK PAGE