Ciao a tutti,
vorrei applicare uno stile css ad un immagine di dimensioni ridotte in modo tale che passando sopra col puntatore del mouse compaia affianco il suo ingrandimento con l' opzione che se si clicca sopra l' immagine più grande questa rimanga bloccata dove si trova.
Ciò che succede è che facendo click sopra funziona tutto eccetto il fatto che la visuale è spostata nella parte superiore della pagina(ma non l' immagine zoomata che stà al suo posto).
Questo è quanto ho scritto:
#content {
position:relative;
top:10px;
left:50px;
width:75px;
height:54px;
background-color:transparent;
z-index:100;
}
#content a img {
border:0;
}
#content a.tumb, #content a.tumb:visited {
display:block;
width:75px;
height:54px;
text-decoration:none;
background-color:#fff;
}
#content a.tumb:hover, #content a.tumb:active{
text-decoration:none;
background-color:transparent;
}
#content a .grande {
display:block;
position:absolute;
width:1px;
height:1px;
top:-1px;
left:-1px;
color:#fff;
background-color:transparent;
}
#content a.tumb:hover .grande {
display:block;
position:absolute;
top:70px;
left:200px;
width:401px;
height:289px;
}