นี่เป็นวิธี JavaScript แบบอินไลน์ที่ง่ายและรวดเร็วในการสลับรูปภาพเริ่มต้นกับรูปภาพอื่นเมื่อคุณเลื่อนเมาส์ไปเหนือรูปภาพ จากนั้นสลับกลับเป็นค่าเริ่มต้นเมื่อคุณเลื่อนเมาส์ออกอีกครั้ง:
<img
onmouseover="this.src='new-image.png'"
onmouseout="this.src='default-image.png'"
src="default-image.png"
/>ตัวอย่างนี้เหมือนกัน แต่ใช้รูปภาพที่พักภายนอกเป็นแหล่งที่มาของรูปภาพ:
<img
onmouseover="this.src='https://via.placeholder.com/150/0000FF/FFFFFF/?text=Digital.com'"
onmouseout="this.src='https://via.placeholder.com/150/FF0000/808080/?text=Down.com'"
src="https://via.placeholder.com/150/FF0000/808080/?text=Down.com"
/>การสาธิตโค้ด
