ทำให้ firefox แสดงภาพเสีย

ปกติแล้วผู้พัฒนาเว็บด้วย 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="" />
จะพบว่าตัวแทนภาพเดี้ยงปรากฏมาแล้วครับ

ใส่ความเห็น

อีเมลของคุณจะไม่แสดงให้คนอื่นเห็น ช่องข้อมูลจำเป็นถูกทำเครื่องหมาย *

คุณอาจใช้แท็กHTMLและแอททริบิวต์เหล่านี้: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>