ciao ragazzi! ho un problema che riguarda sia html che css quindi non sapevo dove andare a scrivere..chiedo scusa se ho sbagliato..
Veniamo a noi!
Ho fatto una pagina semplice semplice costituita da uno sfondo e delle immagini a forma di pulsante che mandano a link.
Questi pulsanti li ho poi resi con 2 immagini diverse al passaggio del mouse con l'hover.
Il problema nasce quando passa il mouse sopra le immagini: funziona l'hover, ma le altre immagini si spostano. A cosa può essere dovuto??
questo è il codice:
Il div classe CONTENITORE è un div che contiene tutte le immagini e viene centrato automaticamente.codice:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Area Riservata</title> <script src="fixedbackground.js" type="text/javascript"></script> <link rel="stylesheet" href="stile_nrg.css" type="text/css" /> </head> <body onload="fixedBackground('elementi_area_2/area2.jpg')"> <div class="contenitore"> [img]elementi_area_2/Pulsantone.png[/img] [img]elementi_area_2/Frecce.png[/img] <div class="cambioimmagine"> <a href="http://organizzazione.nrggroup.it"> [img]elementi_area_2/p_portale.png[/img] [img]elementi_area_2/port_hover.png[/img] </a> </div> <div class="cambioimmagine"> <a href="http://organizzazione.nrggroup.it:8080/Infinitynrg/cms/vademecum.html"> [img]elementi_area_2/p-vademecum.png[/img] [img]elementi_area_2/Vad_hover.png[/img] </a> </div> <div class="cambioimmagine"> <a href="http://organizzazione.nrggroup.it:8080/Infinitynrg/cms/utility.html"> [img]elementi_area_2/Utility.png[/img] [img]elementi_area_2/Ut_hover.png[/img] </a> </div> <div class="cambioimmagine"> <a href="#"> [img]elementi_area_2/B2B.png[/img] [img]elementi_area_2/B2B_hover.png[/img] </a> </div> <div class="cambioimmagine"> <a href="#"> [img]elementi_area_2/Infinity.png[/img] [img]elementi_area_2/Infinity_hover.png[/img] </a> </div> [img]elementi_area_2/logo_nrg.png[/img] </div> </body> </html>
Qui invece c'è il CSS:
Non so se è troppo confusionario.. ma se qualcuno ci capisse qualcosa e potrebbe darmi una mano gliene sarei molto grato..codice:@charset "UTF-8"; /* CSS Document */ .contenitore { display: block; margin-left: auto; margin-right: auto; padding: 0px; width: 547px; height: 667px; } .immagine1 { display: block; } .immagine2 { display: none; } .cambioimmagine:hover .immagine1 { display: none; } .cambioimmagine:hover .immagine2 { display: block; }
Toti.
Rispondi quotando
