Ciao a tutti ho trovato questo script che mi fa un lightbox solo con i css:
http://www.emanueleferonato.com/downloads/lightbox.html
e funziona bene , l'unico mio problema è questo:
Se ho un pagina lunga con la scrollbar e apro la mia lightbox lui mi mostra il div (nero) solo della grandezza della pagina che sta visualizzando, per cui muovendo lo scroll vedrei il distacco del div nero con la pagina..
per capire meglio quello che sto dicendo provato questa pagina html
volevo un aiuto da voi per risolvere questo problema magari utilizzando solo i cssCodice PHP:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>LIGHTBOX EXAMPLE</title> <style> .black_overlay{ display: none; position: absolute; top: 0%; left: 0%; width: 100%; height: 100%; background-color: black; z-index:1001; -moz-opacity: 0.8; opacity:.80; filter: alpha(opacity=80); } .white_content { display: none; position: absolute; top: 25%; left: 25%; width: 50%; height: 50%; padding: 16px; border: 16px solid orange; background-color: white; z-index:1002; overflow: auto; } </style> </head> <body>
This is the main content. To display a lightbox click <a href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='block';document.getElementById('fade').style.display='block'">here</a></p> <div id="light" class="white_content">This is the lightbox content. <a href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none'">Close</a></div> <div id="fade" class="black_overlay"></div> s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
s
sd
v </body> </html>
Grazie a tutti per il vostro aiuto.