bellissimo pop up

**mosaico74** · 24-03-2006, 20:35

ciao ragazzi,
vagando nel web, ho trovato un pop up che non avevo mai visto senza la cornice, secondo me molto bello.

http://www.porsche.com/italy/models/...etail/comfort/

Come funzionano?
E' un cromeless? Ho letto gli articoli sui cromeless, ma non sono mai riuscito a vederli neppure in anteprima, compare sempre la cornice

Forse questo è un nuovo sistema?

grazie e ciao a tutti

**fcaldera** · 24-03-2006, 21:36

è un overlayer

fai una ricerca su scripting per approfondimenti

Ciao

**mosaico74** · 25-03-2006, 17:15

vado a vedere.

grazie per il link

**mosaico74** · 26-03-2006, 20:59

Funziona!!!
Ti posso chiedere un altra cosa?
Se volessi abbinarlo ad un bottone, in modo che appaia solo cliccando come faccio?
Il codice che ho è:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Documento senza titolo</title>
<script>
function closeoverlay() {
document.getElementById('overlay').style.display = 'none';

}
function openoverlay() {
document.getElementById('overlay').style.display = 'block';

}
setTimeout('closeoverlay()',2);
</script>
</head>

<body onload="setTimeout('openoverlay()', 2000); setTimeout('closeoverlay()', 50000);">
<div id="overlay" style="position:absolute; background: #e0e0e8; top:20px; left:100px; width:452px; height:200px; z-index:100; display: block;">
[ X ]
</div>

</body>
</html>

grazie mille

**fcaldera** · 26-03-2006, 21:14

Spostato su scripting

codice:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Documento senza titolo</title>
<script>
function closeoverlay() {
  document.getElementById('overlay').style.display = 'none';

}
function openoverlay() {
  document.getElementById('overlay').style.display = 'block';

}
</script>
</head>


<body>
<div id="overlay" style="position:absolute; background: #e0e0e8; top:20px; left:100px; width:452px; height:200px; z-index:100; display: block;">
[ X ]
</div>

Apri


</body>
</html>

Ciao

**mosaico74** · 27-03-2006, 09:21

su scripting?
lo sposto

**Dan Hero** · 01-08-2007, 17:14

ciao, ho raggiunto questo thread dopo numerose ricerche e vedo che lo script è spiegato molto chiaramente; vorrei sapere solo una cosa: è possibile rendere all'inizio l'overlayer INVISIBILE (da quello che ho capito, l'overlayer è sempre presente ma inizialmente hidden, nel caso del sito della porsche linkato all'inizio con ogni probabilità si tratta di diversi overlayer sulla stessa pagina) ma visibile SOLO cliccando sul tasto "apri" presente nell'esmpio di fcaldera? con quale comando?

Grazie in anticipo.

**Dan Hero** · 01-08-2007, 17:37

ho risolto da solo

codice:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Documento senza titolo</title>
<script>
function closeoverlay() {
  document.getElementById('overlay').style.display = 'none';

}
function openoverlay() {
  document.getElementById('overlay').style.display = 'block';

}
function visible() {
document.getElementById('overlay').style.visibility='visible';
}
function visible() {
document.getElementById('overlay').style.visibility='hidden';
}
</script>
</head>


<body>
<div id="overlay" style="position:absolute; background: #e0e0e8; top:114px; left:226px; width:452px; height:200px; z-index:100; display: block; visibility: hidden;">
chiudi</div>

Apri


</body>
</html>

ma ora sorge un altro dubbio: è possibile posizionare l'overlayer permanentemente al centro della pagina? dandogli delle coordinate, la sua posizione rimane la stessa se la finestra del browser cambia dimensioni (oppure se si modifica la risoluzione); io vorrei che apparisse sempre e comunque al centro della pagina. Inoltre ho notato che se "incontra" (scusate il termine improprio ma non me ne vengono altri) dei file swf, il nostro layer ne viene coperto, come se si trovasse in un livello inferiore, parlando in termini di photoshop.

**fcaldera** · 01-08-2007, 19:58

Originariamente inviato da Dan Hero
ma ora sorge un altro dubbio: è possibile posizionare l'overlayer permanentemente al centro della pagina? dandogli delle coordinate, la sua posizione rimane la stessa se la finestra del browser cambia dimensioni (oppure se si modifica la risoluzione); io vorrei che apparisse sempre e comunque al centro della pagina.

In semplice CSS

body, html {
height : 100%;
}

#overlay {
position: absolute;
height: yy;
width: xx;
left: 50%;
top: 50%;
margin: -(yy/2) 0 0 -(xx/2);
}

Inoltre ho notato che se "incontra" (scusate il termine improprio ma non me ne vengono altri) dei file swf, il nostro layer ne viene coperto, come se si trovasse in un livello inferiore, parlando in termini di photoshop.

aggiungi al flash
<param name="wmode" value="transparent" />
e sarà possibile sovrapporre oggetti ad esso.

Comunque sono cose che si trovavano con una ricerca su CSS e su XHTML...
Ciao

**Dan Hero** · 02-08-2007, 10:03

grazie di tutto

sfortunatamente ho una conoscenza un po superficiale dei css (più degli :hover non uso finora

)

Discussione: bellissimo pop up

Strumenti discussione

Ricerca discussione

Visualizza

bellissimo pop up

Permessi di invio