Swap fra due immagini
Autore: Camillo D.Buongiorno
In un sito creato con frontpage per un amico Radiologo,www.defecografia.itin una pagina c'è una galleria foto con 9 immagini volutamente poco contrastate. Passando col mouse sulle singole IMG, queste si scambiano con la stessa IMG ben contrastata e cliccando si va alla pagina che parla di quel problema medico.
Ora sto rifacendo il sito col Vs. WebSite ultima versione.
Il codice che avevo usato è questo:
<a href="gf_enterocele.htm"> <img border="0" src="Galleria_fotografica/thumb/tn_enteroceleA.jpg" width="100" height="100" style="border: 1px solid #9DB8E1" id="img9" onmouseout="FP_swapImgRestore()" onmouseover="FP_swapImg(0,1,/*id*/'img9',/*url*/'Galleria_fotografica/thumb/tn_enteroceleB.jpg')">
Dove:gf_enterocele.htm porta alla pag. voluta col clic
dove: Galleria_fotografica/thumb/tn_enteroceleA.jpg è il percorso dove c'è l'IMG 1 (tn_enteroceleA.jpg) visibile sulla pagina
e dove: Galleria_fotografica/thumb/tn_enteroceleB.jpg è il percorso dove c'è l'IMG 2 (tn_enteroceleA.jpg) che prende il posto della IMG1 al passaggio del mouse
Ho provato a modificare il codice così come segue ed inserirlo con un widget html nella pagina apposita, eccolo:
<a href="enterocele.html">
<img border=
"0"src="c:/defecografia/Galleria_fotografica/thumb/tn_enteroceleA.jpg"width="100"height="100"style="border: 1px solid #9DB8E1"id="img9"onmouseout="FP_swapImgRestore()"onmouseover="FP_swapImg(0,1,/*id*/'img9',/*url*/'c:/defecografia/Galleria_fotografica/thumb/tn_enteroceleB.jpg')">
Non funziona completamente.
La prima IMG si vede e se la clicco , mi porta alla pag. giusta enterocele.html, l'ultima parte è sicuramente sbagliata e non la capisco neppure. Lo 0,1, l'id e so che img9 è la nona delle immagini, (parametro inserito da flash?), nessuna delle mie immagini sul PC si chiama img1, img2 ecc.... img9
poi rimane il percorso dell'immagine da scambiare che dovrebbe essere corretto c:/defecografia/Galleria_fotografica/thumb/tn_enteroceleB.jpg
Mi sapete dire dove la sintassi è sbagliata?
Oppure mi potete fornire un codice per fare uno swap?
Portate pazienza e ...intanto grazie
ciao,
...!?... c:/defecografia/Galleria_fotografica/thumb/tn_enteroceleB.jpg ...!?...
... deve funzionare solo sul tuo PC così com'è adesso, o deve funzionare sul Sito in RETE...?...
.
bye, KolAsim
Guarda qui un'esempio perfetto con codice pronto...metodo1...
http://www.essedi.altervista.org/_sito/rollover.html
Autore
Per KolAsim: meglio se funzionasse sia sul PC che in rete!
Per Mirko: ho provato quanto descritto nel sito. Ho realizzato con Photoshop, due img una B&W e una seppia chiamandole rispettivamente img1 e img1s. e caricandole nella sez. esperto nella cartella files che viene generata in automatico. Dopo ho inserito il codice fornito dal sito che mi avete indicato con le modifiche del caso:
<a title="Vai alla pagina"href="F-defecogramma-normale.html">
<img src="files/img1s.png"alt=""
<a title="Vai alla pagina"href="F-defecogramma-normale.html">
Cosa vuol dire??? devi metterehttp://www enon F-......
ciao Camillo,
... per il rollover sull'immagine, tipo quello usato da me da circa 15 anni, come in questa pagina: http://www.zspace.it/kolasim/website/iframeyoutube/iframe.html
... potresti usarne un codice semplicissimo, ed esattamente questo:
... ovviamente personalizzando i valori delle misure ed il nome delle immagini, ed allegandole come hai già fatto con l'Oggetto Codice HTML/Esperto...
... invece il codice va incollato nello stesso oggetto, ma nel pannello HTML
... se per caso volessi far aprire la pagina esterna HTML in un'altra finestra del browser, lo stesso codice prenderebbe questa forma con l'aggiunta del parametro TARGET "_blank":
... qui li puoi vedere e copiare il codice per utilizzarlo direttamente: http://www.zspace.it/kolasim/website/immagini/rollover.html
...
.
bye, KolAsim
Nel sito che ti ha indicato Mirko è riportato questo codice:
<a title="Ingrandisci foto" href="img3.html">
<img src="files/img1.png" alt=""
Answer si è mangiato tutto. Intuisco che abbia fatto la stessa cosa con il tuo messaggio.
Allora, incrociando le dita, riprovo a riportare solo la correzione alla prima riga, che deve diventare
<a title="Vai alla pagina F-defecogramma-normale" href="F-defecogramma-normale.html">
Autore
E' questo programma di Post, che si mangia le parole e pezzi di messaggio!!!!
io avevo scritto che dal sito indicatomi da Mirko ho utilizzata la 2a procedura, e tutto funziona da Dio!! Di seguito (se il post non mi viene mangiato, c'è il codice modificato:
<a title="Vai alla pagina" href="F-defecogramma-normale.html">
<img src="files/img1s.png"alt=""
Autore
Infatti il post si è mangiato metà del mio messaggio e cioè: vorrei usare la 3a procedura del sito indicato da Mirko quella con gli sprite, ho realizzato 1 singola immagine delle 2 occorrenti mettendole affiancate (o vanno messe una sopra all'altra), ma non sono riuscito a capire come va modificato il codice fornito:
<a class="sdImg00" id="sdImg03" href="files/img3.png" title = "Ingrandisci foto"></a>
Autore
OK! OK! Ho utilizzato con le dovute modificheil codice che mi avete suggerito più su, cioè:
<a href="F-rettocele.html">
<img src="files/img1.png"width="100"height="100"border=0
Autore
Azzo ma perchè il post viene sempre mangiato a metà!!
Comunque con le parole che mancano, c'era il resto del codice e ringraziavo tutti !!!
Non devi inserire le immagini..ma oggetto html e inserisci il tuo codice, poi in sezione esperto alleghi le immagini che automaticamente vanno nella cartella "files"
Per scrivere dei codici qui, devi selezionarli e metterli in grassetto e corsivo...a me cosi funziano...