Html:
codice:
<div id="thumbDesc">
<div id="layer1" >
Cosa cerchi?</p></div>
<div id="layer2" >
Quadri</p></div>
<div id="layer3" >
Ceramiche</p></div>
<div id="layer4" >
Vuoi contattarmi?</p></div>
</div>
CSS:
codice:
#thumbDesc {
width: 333px;
border: 1px solid #666;
height:80px;
padding: 0;
margin: 10px 0 0 0;
overflow: hidden;
}
#thumbDesc p{
padding: 0 25px 0 25px;
}
#layer1, #layer2, #layer3, #layer4 {
position: relative;
top:0px;
visibility: hidden;
}
#layer1 {
visibility:visible;
}
Lo script JS cambia il valore visibility dei layer impostando quello selezionato dal passaggio del mouse come visible e gli altri hidden.
Lo script funziona ma non riesco a posizionare relativamente i div in modo che le scritte appaiano allo stesso posto.