Qualcuno sa se è possibile gestire la visualizzazione o meno di un layer al click senza usare javascript?
grazie
ciao
Qualcuno sa se è possibile gestire la visualizzazione o meno di un layer al click senza usare javascript?
grazie
ciao
l'evento scatenato da un clic è gestibile solo via JavaScript (o tramite altri linguaggio lato client).
ciao
e gli altri linguaggi lato client quali potrebbero essere?
grazie
Prova a vedere se questo codice ti garba. Ciao
<head>
<title> stu nicholls | CSS PLaY | a photograph gallery</title>
<style type="text/css">
#container {position:relative; width:425px; height:430px; background:#efedec url(back1.gif); border:1px solid #000;}
a.gallery, a.gallery:visited {display:block; color:#000; text-decoration:none; border:1px solid #000; width:75px; height:47px; float:left; margin:3px; z-index:50;}
a.slidea {background: #d3d;}
a.slideb {background: #d3d;}
a.slidec {background: #d3d;}
a.gallery span {display:block; position:absolute; width:1px; height:1px; top:5px; left:5px; overflow:hidden; background:#efedec url(back1.gif);z-index:100;}
.slidek {display:block; position:absolute; width:400px; height:250px; top:125px; left:10px; padding:0; border:1px solid #000;}
a.gallery:hover {white-space:normal; border:1px solid #fff;}
a.gallery:hover img {border:1px solid #000; position:relative; z-index:100;}
a.gallery:hover span {display:block; position:absolute; width:402px; height:300px; top:120px; left:5px; padding:5px; font-style:italic; color:#000; background:#efedec url(back1.gif); z-index:100;}
a.gallery:active img, a.gallery:focus img {border:1px solid #000; position:relative; z-index:50;}
a.gallery:active span, a.gallery:focus span {display:block; position:absolute; width:402px; height:300px; top:120px; left:5px; padding:5px; font-style:italic; color:#000; background:#efedec url(back1.gif); z-index:50;}
</style>
</head>
<body>
<div id="wrapper">
<h2>Trallallero</h2>
<div id="info">
<div id="container">
Trallalla
testo 1<span>Contenuto del testo 1</span>
testo 2<span>Contenuto del testo 2</span>
testo3<span>Contenuto del testo 3</span>
</div>
</div>
</body>
</html>
si era quello che cercavo, grazie
non riesco però a capire come gestirlo al click e non al rollover
perché se cambio il "a.gallery:hover span
metti active invece che :hover
Ps: nel css ci sono alcuni attributi in più ... toglili pure
Ciao
si ci avevo provato solo che il layer rimane visibile fino a quando io tengo cliccato...
a me cosi va...
a.gallery:active span {display:block; position:absolute; ....
Ciao
ci sto provando e riprovando ma niente..
potresti ripostare il codice con la modifica che hai fatto?
grazie mille
Ecco:
<head>
<title> stu nicholls | CSS PLaY | a photograph gallery</title>
<style type="text/css">
#container {position:relative; width:425px; height:430px; background:#efedec url(back1.gif); border:1px solid #000;}
a.gallery, a.gallery:visited {display:block; color:#000; text-decoration:none; border:1px solid #000; width:75px; height:47px; float:left; margin:3px; z-index:50;}
a.slidea {background: #d3d;}
a.slideb {background: #d3d;}
a.slidec {background: #d3d;}
a.gallery span {display:block; position:absolute; width:1px; height:1px; top:5px; left:5px; overflow:hidden; background:#efedec url(back1.gif);z-index:100;}
.slidek {display:block; position:absolute; width:400px; height:250px; top:125px; left:10px; padding:0; border:1px solid #000;}
a.gallery:hover {white-space:normal; border:1px solid #fff;}
a.gallery:active span {display:block; position:absolute; width:402px; height:300px; top:120px; left:5px; padding:5px; font-style:italic; color:#000; background:#efedec; z-index:100;}
a.gallery:active img, a.gallery:focus img {border:1px solid #000; position:relative; z-index:50;}
a.gallery:active span, a.gallery:focus span {display:block; position:absolute; width:402px; height:300px; top:120px; left:5px; padding:5px; font-style:italic; color:#000; background:#efedec url(back1.gif); z-index:50;}
</style>
</head>
<body>
<div id="wrapper">
<h2>Trallallero</h2>
<div id="info">
<div id="container">
Trallalla
testo 1<span>Contenuto del testo 1</span>
testo 2<span>Contenuto del testo 2</span>
testo3<span>Contenuto del testo 3</span>
</div>
</div>
</body>
</html>
Ciao
Permessi di invio
Rispondi quotando