<img> etiqueta gris en firebug, por lo tanto, se encuentra el motivo por el que la imagen no aparece. Necesito ayuda para solucionarlo

Question

Estoy depurando un sitio web por las imágenes que faltan. El sitio web usa mucho GWT, por lo que el código fuente no es tan detallado. Empecé a depurarlo con Firebug y descubrí que las etiquetas están atenuadas en la fuente DOM Firebug. Si edito la etiqueta de la imagen en la consola Firebug, digamos agregando solo un espacio, entonces la etiqueta de la imagen ya no aparece gris y aparece en la página.

Puede alguien aquí, por favor señalar por qué las etiquetas de imagen están en gris en el quemador, y la manera de resolver este problema. Nota: hay otras imágenes en la página que funcionan bien, incluso si se generan usando GWT de la misma manera.

Answer 1

Lo más probable es que la imagen esté oculta (a través de CSS probablemente). Haga clic en la etiqueta para ver los estilos aplicados: lo más probable es que vea display: none o algo similar.
cuanto a por qué la imagen (s) se ocultan - ya sea las reglas CSS se mezclaron y dieron lugar a este tipo de comportamiento (Firebug debe ayudar con la investigación) o es parte de la lógica de la aplicación (ocultar la barra de progreso cuando no son necesarios, etc.)

Answer 2

En mi caso fue atenuado mi imagen (en gris) en Firebug debido a la imagen que tiene su altura y anchura a 0 px tanta eficacia que estaba oculto en la pantalla. así que deduzco que el color gris no es visible en la pantalla.

Answer 3

Estaba teniendo el mismo problema. Firebug estaba mostrando mi elemento de contenedor, que tenía un img, como atenuado. El elemento se mostró en Firefox (y otros navegadores modernos), pero no en IE8.

Sabiendo que estaba configurando la pantalla: ninguna; y más tarde en el guión que lo bloqueaba, no era mi problema ... agregar la falta de ancho y alto en el estilo era la solución para mí.

Para mí, era una cuestión de establecer explícitamente la anchura y la altura en mi div (que tiene mi IMG) en el interior del contenedor div. No tenía ancho y alto en mi div completamente posicionado. Tan pronto como agregué que el gris oscuro era sólido en Firebug. ¡También arreglé mi problema de div perdido en IE8! (¿Qué fue lo que me puso en el camino de depuración en el primer lugar)

IE8 le gusta anchura y la altura conjunto, donde todos los otros navegadores modernos no les importaba y todavía muestran el div. Firebug mostró el elemento atenuado, pero Firefox el navegador mostró el elemento div muy bien.

#slidesContainer { 
    position: relative; 
    width: 871px; 
    height: 275px; 
    padding: 8px 8px; 
    overflow: hidden; 
    } 

    #slidesContainer div { 
    position: absolute; 
    width: 871px; 
    height: 275px; 
    display: none; 
    } 

Answer 4

Como un FYI para otras personas, yo estaba teniendo este problema y no podía averiguarlo - Firebug en gris correctamente las imágenes invisibles. Estoy ejecutando el add-on AdBlock Plus y estaba ocultando las imágenes porque estaban en una carpeta llamada anuncios. El sorteo fue que las imágenes tienen clases agregadas con cadena aleatoria, p. class = "auwhaezfynjjayjvlasn". Cambié el nombre de la carpeta de anuncios y voila, visible y no en gris en Firebug.

Answer 5

Otro FYI - mi ARCHIVO fue nombrado xxx- anuncios .swf y el archivo NO se mostraría en Firefox o Chrome pero funcionó bien en Safari, IE y Opera.

Estoy ejecutando Adblock plus en Firefox y Chrome.

Me parece que como práctica general de software, Adblock está tratando de ser demasiado inteligente en su detección. Me costó unos 2 días de depuración. Grrrr.

Gracias a Dios, finalmente encontré este foro.

Answer 6

Tuve el mismo problema con los iconos de redes sociales, y también fue Ad-Blocker (en Firefox) lo que causó. El texto alternativo de los iconos tenía alt = "Facebook" (Twitter, Instagram) en él. Cambiar eso a alt = "Facebook_xxx" fue suficiente para resolver el problema.