ปกติแล้วผู้พัฒนาเว็บด้วย firefox จะเจอสิ่งหนึ่งที่ดูจะเป็นปัญหาคือ เมื่อมีภาพที่ลิ้งค์เสีย หรือภาพเดี้ยง
firefox จะทำให้ภาพนั้นเป็นพื้นที่ว่างเปล่า หรือแสดงแต่ข้อความใน alt="..." ออกมาแค่นั้น
ปกติแล้วของแบบนี้มันก็ดีสำหรับผู้ใช้เท่านั้น แต่สำหรับนักพัฒนาอย่างเรามันทำให้เราไม่เห็นภาพเสีย ทำให้งานผิดพลาดรอดสายตาไปได้ง่ายๆ
วิธีแก้ไขให้แสดงภาพเสีย
พิมพ์ about:config ที่ address bar
filter คำว่า image
มองหา browser.display.show_image_placeholders เช็คให้แน่ใจว่ามีค่าเป็น true (ปกติค่าเดิมคือ true)
เปิด folder %appdata%\Mozilla\Firefox\Profiles<username>\chrome
ตัวอย่างเช่น C:Users\<my windows username>\AppData\Roaming\Mozilla\Firefox\Profiles<text>.default\chrome
ทั้งนี้หากไม่มี folder chrome ก็ขอให้สร้างขึ้นมา
สร้างไฟล์ชื่อ UserContent.css แล้วก๊อปปี้โค้ด css ต่อไปนี้ไว้ข้างในไฟล์
/* Enable image placeholders */
@-moz-document url-prefix(http), url-prefix(file) {
img:-moz-broken{
-moz-force-broken-image-icon:1;
width:24px;
height:24px;
}
}
บันทึกไฟล์นี้ จากนั้นก็ restart firefox เป็นอันเสร็จขั้นตอนทั้งหมด
ทดสอบได้โดยสร้างไฟล์ .html ขึ้นมาสักไฟล์หนึ่ง แล้วใส่รูปเสียลงไป เช่น <img src="not-exists-image.jpg" alt="" />
จะพบว่าตัวแทนภาพเดี้ยงปรากฏมาแล้วครับ
