Intercambio de una imagen durante el desarrollo web

Question

Estoy tratando de ver cómo se vería una determinada página web si sustituyera una determinada imagen por otra. En lugar de cargar la imagen, editar el sitio, etc., cada vez que lo modifico, me gustaría saber si hay una forma de cambiar la imagen en la página a mi versión local mientras veo la página remota.

Uso Firebug para depurar el desarrollo web, pero estoy abierto a cualquier otra herramienta que pueda hacer esto.

(es absolutamente imposible para buscar esto y encontrar otra cosa que preguntas sobre el intercambio de imágenes dinámicas en un sitio web desplegado, lo siento si esto es un duplicado.)

Agregado: he intentado sustituir una file:/// URI apuntando a la imagen (copiada y pegada desde la barra de direcciones luego de abrir manualmente la imagen), y desafortunadamente, no funcionó; la imagen no puede cambiar.

Answer 1

Parece que solo funciona con los protocolos http [s] (probablemente por razones de seguridad). Puede almacenar sus imágenes en un servicio como Dropbox, compartir la imagen o carpeta y luego usar las URL públicas.

Realmente, puedes usar cualquier imagen accesible a través de la web, por lo que también funcionaría un servidor local.

Answer 2

Si su imagen está en un servidor localhost (no como archivo, tenga en cuenta) creo que todavía puede poner esa url localhost en el elemento firebug inspeccionar y va a funcionar.

Intenté una ruta de archivo absoluta, pero al parecer no funciona. Así que supongo que solo tienes que conformarte con una imagen del servidor localhost. Eso funciona para mí

Answer 3

Respuesta rápida y de baja tecnología: tome una captura de pantalla de la página ábrala en photoshop y coloque la imagen local en una capa encima de la imagen de la página web.

Answer 4

Hola, si está sirviendo desde un servidor web, probablemente no pueda apuntarlo a un archivo en su disco local. Incluso si su localhost, no puede apuntar a un archivo local c: /test.jpg por ejemplo. Es porque el navegador clasifica de sandbox ur página para que las secuencias de comandos no puedan acceder a los archivos locales.

Una forma es subir el nuevo archivo (new_file.jpg) al servidor web, dar el enlace de la imagen un id

<img id="something1" src="test.jpg"/> 

Usando jQuery en el quemador, ver la ventana de hacer

$("#something1").attr("src","new_file.jpg"); 

Usted debería ver la imagen cambiar Si no está utilizando jQuery, puede usar document.getElementById ("something1") y obtener el elemento para modificar.

Answer 5

Otra forma es utilizar http://makiapp.com/

Se puede superponer una imagen desde su ordenador en cualquier sitio web que mira con esto. Una herramienta muy buena para alinear una comp con tu código.

Answer 6

Puede:

1. Arrastre su imagen de prueba en Google Drive
2. abrirlo en un navegador
3. Ir a la ruta de la imagen real
4. Usar este camino como sustituto en Firebug

Es casi tan rápido como trabajar desde un disco local.