Printable View
Salve a tutti sto preparando il mio sito e mi manca ancora una cosa:
per tutti i link sto usando l'effetto suggerito da W L, cioè quello in cui passando il mouse sopra il collegamento le scritte si ridimensionano crescendo.
La mia domanda è: si può fare la stessa cosa ma anzichè il collegamento sulla scritta è su una immagine?
grazie a mille
buonaserata
Mmm non ne sono sicuro ma mi sa che devi usare un'altra immagine più grande da far cambiare al passaggio del mouse..
OnMouseOver, giusto?
Si può anche senza un'immagine più grande , semplicemente così :Citazione:
Originalmente inviato da metaphor
Tra <head> & </head>
E nell'immagine metti :Codice HTML:<script language="JavaScript">
<!--
function cambia(nomeimmagine, width, height)
{
nomeimmagine.width = width;
nomeimmagine.height = height;
}
// -->
</script>
Devi impostare in onMouseOver="cambia(immagine1,600,250)" :Codice HTML:<img src="tuaimmagine.ext" width="100" height="200" name="immagine1" onMouseOver="cambia(immagine1,600,250)" onMouseOut="cambia(immagine1,500,73)">
1- nel primo campo metti il nome dell'immagine
2- nel secondo la larghezza
3- nel terzo l'altezza desiderata
Devi impostare in onMouseOut="cambia(immagine1,600,250)" :
1- stesso tipo come sopra , solo metti altezza e larghezza originali ^_^
P.S.: ricordati di mettere un nome all'immagine con :
name="nomeimmagine"
Ciaoooo !!
buongiorno e grazie
ok funziona, ora però bisognerebbe fare un collegamento esterno .js e richiamarlo in htm.
ciaooooooo
Uhm ... intendi forse :Citazione:
Originalmente inviato da archidaniele
img.js
tra il tag <head> e </head> di pagina.htmlCodice HTML:function cambia(nomeimmagine, width, height)
{
nomeimmagine.width = width;
nomeimmagine.height = height;
}
Codice HTML:<script language="javascript1.1" type="text/javascript" src="img.js"></script>
si ma così non va, provo a modificarlo
O.o hai messo nel tag <img> i parametri onmouseover eccetera ?
scusami, potresti ripostarmi il codice completo per favore? grazie mille
nell'immagine :
tra il tag <head> e </head>Codice HTML:<img src="tuaimmagine.ext" width="100" height="200" name="immagine1" onMouseOver="cambia(immagine1,600,250)" onMouseOut="cambia(immagine1,500,73)">
Il file img.jsCodice HTML:<script language="javascript1.1" type="text/javascript" src="img.js"></script>
Codice HTML:function cambia(nomeimmagine, width, height)
{
nomeimmagine.width = width;
nomeimmagine.height = height;
}
PERFETTO!!! grazie mille comunitàvirtuali!
vista la tua home, votata e metterò il tuo indirizzo nella mia futura
ultimissima cosa, se io volessi dare questa caratteristica a più di una immagine, posso richiamare da un unico .js?
buonproseguimento
sì sì ^_^
E' fatto apposta , per ogni immagine cambi il nome , poi , se vuoi che passando su una cambino due uguali magari metti a tutte e due il nome uguale ^_^
Puoi fare tantissime cose con questo :-P
cioè? mica ho capito sai...Citazione:
Originalmente inviato da comunitavirtuali
Il file *.js resta sempre uguale e devi aggiungere solo le nuove immagini con i parametri che vuoi.Citazione:
Originalmente inviato da archidaniele
Codice HTML:<img src="tuaimmagine.ext" width="100" height="200" name="immagine1" onMouseOver="cambia(immagine1,600,250)" onMouseOut="cambia(immagine1,500,73)">
<img src="tuaimmagine2.ext" width="100" height="200" name="immagine2" onMouseOver="cambia(immagine2,600,250)" onMouseOut="cambia(immagine2,500,73)">
Ad esempio così :Citazione:
Originalmente inviato da archidaniele
Codice HTML:
<img src="immagine.ext" width="100" height="200" name="immagine1" OnMouseOver="cambia(immagine2,600,250)" onMouseOut="cambia(immagine2,500,73)"> <br><br><br><br>
<img src="immagine2.ext" width="100" height="200" name="immagine2" onMouseOver="cambia(immagine1,600,250)" onMouseOut="cambia(immagine1,500,73)">
sì questo l'ho capito ma il file .js rimane così oppure devo integrarlo con dei copia/incolla
[html]function cambia(immagine1, width, height)
{
nomeimmagine.width = width;
nomeimmagine.height = height;
}
function cambia(immagine2, width, height)
{
nomeimmagine.width = width;
nomeimmagine.height = height;
}[html]
cambiando nella prima riga il nome dell'immagine?
te lo chiedo perchè ho pravato e per ora son riuscito a farlo solo nel modo sopradetto.
No , non devi cambiarlo , ti basta includerlo o metterlo una sola volta , devi cambiare il nome dell'immagine nel tag <img name"nomeimmagine"> per ogni immagine :
Codice HTML:<img src="immagine.ext" width="100" height="200" name="immagine1" OnMouseOver="cambia(immagine2,600,250)" onMouseOut="cambia(immagine2,500,73)">
<img src="immagine2.ext" width="100" height="200" name="immagine2" onMouseOver="cambia(immagine1,600,250)" onMouseOut="cambia(immagine1,500,73)">
<img src="immagine3.ext" width="100" height="200" name="immagine3" OnMouseOver="cambia(immagine3,600,250)" onMouseOut="cambia(immagine3,500,73)">
<img src="immagine4.ext" width="100" height="200" name="immagine4" onMouseOver="cambia(immagine4,600,250)" onMouseOut="cambia(immagine4,500,73)">
e così via ................
Edit :
:-P stiamo rispondendo in contemporanera io e Funcool :-P
Il file *.js dovrebbe rimanere sempre lo stesso. Se non funziona dove metti le immagini sostituisci name con id e il codice del *.js scrivilo così:
Codice:function cambia(nomeimmagine, width, height) {
document.getElementById(nomeimmagine).width = width;
document.getElementById(nomeimmagine).height = height;
}
perfetto funziona e pure benissimo!
grazie
buonlavoro
Visto che risolto, chiudo.