Обмен изображения во время веб-разработки

Question

Я пытаюсь понять, как будет выглядеть определенная веб-страница, если я заменю одно изображение другим. Вместо того, чтобы загружать изображение, редактировать сайт и т. Д., Каждый раз, когда я настраиваю его, я хотел бы знать, есть ли способ изменить изображение на странице на мою локальную версию при просмотре удаленной страницы.

Обычно я использую Firebug для отладки веб-разработки, но я открыт для любого другого инструмента, который может это сделать.

(Совершенно невозможно найти это и найти что-либо, кроме вопросов о динамической замене изображений на развернутом веб-сайте, поэтому извините, если это дубликат.)

Добавлено: Я только что попытался заменить file:/// URI, указывающий на изображение (скопированный и вставленный из адресной строки после ручного открытия изображения), и, увы, это не сработало - изображение не работает изменить.

Answer 1

Кажется, он работает только с протоколами http [s] (вероятно, по соображениям безопасности). Вы можете хранить свои изображения в сервисе, например Dropbox , поделиться изображением или папкой, а затем использовать публичные URL-адреса.

Действительно, вы можете использовать любые изображения, доступные через Интернет, поэтому локальный сервер тоже будет работать.

Answer 2

Если ваше изображение находится на локальном сервере (не так, как вам кажется, файл), я думаю, вы все равно можете поместить этот локальный URL в элемент проверки firebug, и он будет работать.

Пробовал абсолютный путь к файлу, но он, очевидно, не работает. Так что, думаю, вам просто нужно обойтись с образом локального сервера. Это работает для меня

Answer 3

Вы можете:

1. Перетащите тестовое изображение в Google Drive
2. Открыть в браузере
3. Перейти к фактическому пути изображения
4. Используйте этот путь как замену в Firebug

Это почти так же быстро, как работа с локального диска.

Answer 4

Другой способ - использовать http://makiapp.com/

Вы можете наложить изображение с вашего компьютера на любой веб-сайт, на который вы просматриваете. Очень классный инструмент для выравнивания компа с вашим кодом.

Answer 5

Привет, если вы работаете с веб-сервера, вы, вероятно, не можете указать ему файл на локальном диске. Даже если это localhost, вы не можете указать локальный файл c: /test.jpg, например. Это потому, что браузер сортирует страницу с песочницей, чтобы скрипты не могли получить доступ к локальным файлам.

Один из способов - загрузить новый файл (new_file.jpg) на веб-сервер, присвоив ссылке на изображение идентификатор

.

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

Используя jQuery в окне просмотра firebug, сделайте

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

Вы должны увидеть изменение изображения. Если вы не используете jQuery, вы можете использовать document.getElementById ("thing1 ") и получить элемент для изменения.

Answer 6

Быстрый и Lowtech Ответ: Сделайте снимок экрана со страницей, откройте ее в фотошопе и поместите локальное изображение в слой над изображением веб-страницы.