Valutazione 4.87/ 5 (100.00%) 5838 voti

Condividi:        

[html] Cambiare immagine al passare del mouse

Problemi di HTML? Di PHP, ASP, .NET, JSP, Perl, SQL, JavaScript, Visual Basic..?
Vuoi realizzare programmi in C, C++, Java, Ruby o Smalltalk, e non sai da che parte cominciare?
Entra qui e troverai le risposte!

Moderatori: Triumph Of Steel, archimede

[html] Cambiare immagine al passare del mouse

Postdi Joshua82 » 03/07/07 12:03

ciao ragazzi,
sono di nuovo qui a chiederevi aiuto.
sto cercando di scrivere il codice di una pagina web (html) ed in particolare il codice che mi permetta di far cambiare una immagine al passare del mouse su un'altra immagine...
mi spiego meglio:
- Abbiamo 3 immagini, A B e C
- vorrei che quando il cursore del mouse passa sopra l'immagine A l'immagine C cambi in B
spero di essere stato chiaro
grazie a tutti coloro che mi risponderanno...

ps. si può fare la stessa cosa però facendo cambiare immagine in un'altra pagina? cioè, se ad esempio ho una pagina divisa in due form, posso far modificare l'immagine C, presente nella form di destra, in B facendo passare il mouse sull'immagine A presente nella form di sinistra?

grazie di nuovo
Joshua82
Utente Junior
 
Post: 84
Iscritto il: 17/11/06 12:45

Sponsor
 

Postdi BianConiglio » 03/07/07 12:30

vai su html.it e informati su javascript.. in particolare mouseover e simili :)

ciao ciao
BianConiglio
Utente Senior
 
Post: 4710
Iscritto il: 26/12/01 01:00
Località: Varese / Lugano

Postdi Joshua82 » 03/07/07 14:45

trovato:>
Codice: Seleziona tutto
<script>

function changeimage(towhat,url){
if (document.images){
document.images.targetimage.src=towhat.src
gotolink=url
}
}
function warp(){
window.location=gotolink
}

</script>
<script language="JavaScript1.1">
var myimages=new Array()
var gotolink="#"

function preloadimages(){
for (i=0;i<preloadimages.arguments.length;i++){
myimages[i]=new Image()
myimages[i].src=preloadimages.arguments[i]
}
}

preloadimages("01.gif","02.gif","03.gif")
</script>

</head>
<body >
<br /><br />
<div align="center">

<a href="javascript:warp()"><img src="01.gif" name="targetimage" border=0></a>

<br><br>

<a href="#" onMouseover="changeimage(myimages[0],this.href)">Immagine 1</a><br>
<a href="#" onMouseover="changeimage(myimages[1],this.href)">Immagine 2</a><br>
<a href="#" onMouseover="changeimage(myimages[2],this.href)">Immagine 3</a>
Joshua82
Utente Junior
 
Post: 84
Iscritto il: 17/11/06 12:45

Postdi Jonlord » 25/08/07 16:09

Se la tua necessita' si estende solamente a immagini di sfondo per un collegamento

<div id="menu">
<ul>
<li><a href="#">home</a></li>
</ul>
</div>

puoi risparmiare un gran mucchio di fatica con CSS, scrivendo nel foglio di stile

#menu a {
background-image: url('button1.gif');
}

#menu a:hover {
background-image: url('button2.gif');
}



E qui è evidente che non puoi rolloverare immagini in altre pagine, e l'applicazione e' limitata solo a immagini che fanno da sfondo a links...
Jonlord
Utente Senior
 
Post: 331
Iscritto il: 17/11/02 15:26
Località: Lugano (Svizzera)

Postdi mrblue » 27/08/07 15:23

la cosa bella di questo sistema è che non richiede js :D
Sbagliare è umano, ma per riuscire davvero a incasinare completamente le cose ci vuole un computer.
---------------------
http://mrblue73.blogspot.com/
mrblue
Utente Senior
 
Post: 364
Iscritto il: 22/10/01 01:00
Località: Roma

Postdi Jonlord » 30/08/07 11:13

A mio avviso è il metodo più facile di roll-over-states....
Però, chiaro, è troppo limitante...
uno non puo fare un

--html:---
<tag id="rollover">...</tag>

<!-- il tag 'tag' non esiste, indica solo un generico tag:) -->

--css:----
#rollover a:hover{
background-image: url('alternative.png');
}



Da quel che mi risulta....., no?
Jonlord
Utente Senior
 
Post: 331
Iscritto il: 17/11/02 15:26
Località: Lugano (Svizzera)


Torna a Programmazione


Topic correlati a "[html] Cambiare immagine al passare del mouse":


Chi c’è in linea

Visitano il forum: Nessuno e 3 ospiti