Secret Celtic RadiO

ลำดับตอนที่ #3 : 3

The cat Code
สงวนลิขสิทธิ์ที่โค้ดแมวๆเท่านั้น! ห้ามก็อปไปแจกต่อนะครับผม
เชิญคอมเม้นตามสบายได้ในตอนนี้ค่ะ ^-^ 

- - - - - - - - - - - - - - - - - - - - - - - -  เส้นคั่น - - - - - - - - - - - - - - - - - - - - - - - -

ตัวอย่างโค้ด
นำเมาส์ชี้ที่ภาพเลยคะ (^-^)
มาเป็นคอลเลคชั่น มือใหม่หัดถ่าย ^^

รับโค้ดเชิญทางนี้

<center> <style name="khunklaotk" type="text/css"> .klao{ position: relative; width: 290px; height: 195px; top: 0px; left: 0px; } .klao img{ position: absolute; width: 290px; height: 195px; top: 0px; left: 0px; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; } .klao:hover img{ z-index: 1; } .klao:hover img (1){ -ms-transform: translate(40%,80%) rotate(-40deg); -webkit-transform: translate(40%,80%) rotate(-40deg); transform: translate(40%,80%) rotate(-40deg); } .klao:hover img (2){ -ms-transform: translate(30%,60%) rotate(-30deg); -webkit-transform: translate(30%,60%) rotate(-30deg); transform: translate(30%,60%) rotate(-30deg); } .klao:hover img (3){ -ms-transform: translate(20%,40%) rotate(-20deg); -webkit-transform: translate(20%,40%) rotate(-20deg); transform: translate(20%,40%) rotate(-20deg); } .klao:hover img (4){ -ms-transform: translate(10%,20%) rotate(-10deg); -webkit-transform: translate(10%,20%) rotate(-10deg); transform: translate(10%,20%) rotate(-10deg); } .klao:hover img (5){ -ms-transform: translate(40%,-80%) rotate(40deg); -webkit-transform: translate(40%,-80%) rotate(40deg); transform: translate(40%,-80%) rotate(40deg); } .klao:hover img (6){ -ms-transform: translate(30%,-60%) rotate(30deg); -webkit-transform: translate(30%,-60%) rotate(30deg); transform: translate(30%,-60%) rotate(30deg); } .klao:hover img (7){ -ms-transform: translate(20%,-40%) rotate(20deg); -webkit-transform: translate(20%,-40%) rotate(20deg); transform: translate(20%,-40%) rotate(20deg); } .klao:hover img (8){ -ms-transform: translate(10%,-20%) rotate(10deg); -webkit-transform: translate(10%,-20%) rotate(10deg); transform: translate(10%,-20%) rotate(10deg); } .klao:hover img (9){ -ms-transform: scale(1.1,1.1) ; -webkit-transform: scale(1.1,1.1) ; transform: scale(1.1,1.1) ; } </style> <div class="albums"> <div class="albums-tab"> <div class="albums-tab-thumb klao"> <img src="ใส่ยูอาแอลรูปภาพ1" class="all studio"/> <img src="ใส่ยูอาแอลรูปภาพ2" class="all studio"/> <img src="ใส่ยูอาแอลรูปภาพ3" class="all studio"/> <img src="ใส่ยูอาแอลรูปภาพ4" class="all studio"/> <img src="ใส่ยูอาแอลรูปภาพ5" class="all studio"/> <img src="ใส่ยูอาแอลรูปภาพ6" class="all studio"/> <img src="ใส่ยูอาแอลรูปภาพ7" class="all studio"/> <img src="ใส่ยูอาแอลรูปภาพ8" class="all studio"/> <img src="ใส่ยูอาแอลรูปภาพ9" class="all studio"/> </div>

ขอบพระคุณทุกท่านที่ยังไม่ลืมโค้ดแมวๆ ร้านโค้ดเล็กๆน้อยๆแห่งนี้นะคะ

และก็... อย่าลืม ถ้าชื้นชอบก็คอมเม้นเป็นกำลังใจให้กันสักนิดนึงนะคะ ^_^/

- - - - - - - - - - - - - - - - - - - - - - - -  เส้นคั่น - - - - - - - - - - - - - - - - - - - - - - - -