2010-06-02 4 views
8

Sto cercando di vedere ciò che una certa pagina web potrebbe apparire come se ho sostituito una certa immagine con un altro. Invece di caricare l'immagine, modificare il sito, ecc, ogni volta che ho modificarlo, mi piacerebbe sapere se c'è un modo per cambiare l'immagine nella pagina per la mia versione locale durante la visualizzazione della pagina remota.Scambiare un'immagine durante lo sviluppo del web

Io uso Firebug per il debug di sviluppo web in genere, ma sono aperto a qualsiasi altro strumento che potrebbe farlo.

(è assolutamente impossibile per la ricerca di questo e trovare nulla, ma domande su swap immagine dinamica su un sito web schierato, mi dispiace se questo è un duplicato.)

Aggiunto: Ho appena provato sostituire un file:/// URI che punta all'immagine (copiato e incollato dalla barra degli indirizzi dopo aver aperto manualmente l'immagine), e ahimè, non ha funzionato - l'immagine non riesce a cambiare.

risposta

8

Sembra funzionare solo con i protocolli http [s] (probabilmente per motivi di sicurezza). È possibile memorizzare le foto su servizio come Dropbox, condividere l'immagine o la cartella, quindi utilizzare gli URL pubblici.

In realtà, è possibile utilizzare qualsiasi immagine accessibile dal Web, quindi anche un server locale funzionerebbe.

+3

Personalmente userei Dropbox o qualcosa di simile _unless_ hai già un locale server in esecuzione. –

+0

Non ho un server locale in esecuzione, ma un altro URL accessibile pubblicamente ha fatto il trucco. – detly

1

Se l'immagine è in un server localhost (non come un problema di file) penso che si possa ancora inserire l'url localhost nell'elemento inspect firebug e funzionerà.

provato un percorso assoluto, ma a quanto pare non funziona. Quindi immagino che devi solo accontentarti di un'immagine del server localhost. Questo funziona per me

+0

Si potrebbe fare senza un server. Prova: 'file: /// path/to/img.png' – Anthony

+3

appena provato questo (file: /// etc) non funziona apparentemente – corroded

0

Risposta rapida e Lowtech: scatta una schermata della pagina aprila in Photoshop e rilascia l'immagine locale su un livello sopra l'immagine della pagina web.

0

Salve se si sta servendo da un server web, probabilmente non si può puntare a un file sulla propria unità locale. Anche se il suo localhost, non può puntare ad un file locale c: /test.jpg per esempio. È perché il browser ordina la tua pagina sandbox in modo che gli script non possano accedere ai file locali.

Un modo è quello di caricare il nuovo file (new_file.jpg) al server web, dare il link dell'immagine un id

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

utilizzando jQuery nella Firebug guardare finestra fare

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

È dovrebbe vedere il cambiamento dell'immagine. Se non si utilizza jQuery, è possibile utilizzare document.getElementById ("something1") e ottenere l'elemento da modificare.

0

Un altro modo è quello di utilizzare http://makiapp.com/

È possibile sovrapporre un'immagine dal tuo computer su qualsiasi sito web si guarda a questo. Strumento molto interessante per allineare un comp con il tuo codice.

0

È possibile:

  1. Trascinare l'immagine di prova in Google Drive
  2. Aprire in un browser
  3. Vai al percorso immagine reale
  4. utilizzare questo percorso come sostituto in Firebug

È quasi veloce come lavorare da un'unità locale.

+0

"Vai al percorso dell'immagine reale." Puoi chiarire questo passaggio? Ho provato a farlo con un SVG, ma non sono riuscito a trovare il percorso vero e proprio con l'ispettore del browser. – fitojb