Code :
<style type="text/css">
a img {ใส่โค๊ต}
a:hover img {ใส่โค๊ต}
</style>
คำอธิบาย :
a img {ใส่โค๊ต} = เอฟเฟคของรูปปกติ
a:hover img {ใส่โค๊ต} = เอฟเฟคของรูปหลังชี้ Mouse
ถ้าอยากให้เป็นภาพปกติก็ใส่โค๊ต Filter: none = ภาพปกติ
เอฟเฟคเลือกใส่เอาเองเลยจ๊ะ :
นำไปใส่ในช่อง {} นะจ๊ะ
- ชี้เเล้วภาพขาว-ดำ
Filter: Gray
- ชี้เเล้วภาพเเนวx-ray
Filter: Xray
- ชี้เเล้วภาพกลับเป็นสีตรงข้ามกัน
Filter: Invert
- ชี้เเล้วภาพจางลง
Filter: Alpha(opacity=60)
**ปรับตรงตัวเลขไปเรื่อยๆเพื่อลดค่าความจางความเข้ม **
- ภาพเบลอธรรมดา
Filter: Blur
- ภาพเบลอมากๆ
Filter: Blur(Add = 0, Direction = 225, Strength = 10)
- ชี้ลิ้งเป็นรูปคลื่น
Filter: Wave(Add=0, Freq=10, LightStrength=20, Phase=220, Strength=10)
- ชี้ลิ้งเเล้วเป็นกลมๆ
Filter: Alpha(Opacity=100, FinishOpacity=0, Style=2, StartX=20, StartY=40, FinishX=0, FinishY=0)
- ชี้ลิ้งเเล้วเป็นคลื่น
Filter: Alpha(Opacity=100, FinishOpacity=0, Style=2, StartX=20, StartY=40, FinishX=0, FinishY=0) Wave(Add=0, Freq=5, LightStrength=20, Phase=220, Strength=10)
- กลับด้านซ้าย-ขวา
FILTER: fliph()
- ชี้ลิ้งเเล้วความเข้มของสี ไล่จากซ้าย->ไปขวา
FILTER: Alpha(Opacity=100,FinishOpacity=0,Style=1)
- ชี้ลิ้งเเล้วความเข้มสี ไล่จากขวา->ไปซ้าย
FILTER: Alpha(Opacity=0,FinishOpacity=100,Style=1)
- ไล่สีจากกลางภาพ ไปขอบภาพ
FILTER: Alpha(Opacity=100,FinishOpacity=0,Style=3)
- ชี้ลิ้งเเล้วใส่ Filter แบบไล่สีเป็นวงกลมให้กับภาพ
FILTER: Alpha(Opacity=100,FinishOpacity=0,Style=2)
- ภาพปกติ
Filter: none
ตัวอย่าง :
<style type="text/css">
a img {Filter: Xray}
a:hover img {Filter: none}
</style>
ก่อนเอาเม้าส์ชี้จะเป็นภาพเอกเรย์ทั้งหน้า...แต่เวลาเอาเม้าส์ชี้จะกลับเป็นรูปภาพปกติ