Popup a discesa

**Symbian** · 03-09-2006, 19:12

Ciao a tutti

sto cercando disperatamente il modo di mettere sul mio sito un popup che appare automaticamente tipo questo che potete vedere QUI' (aspettate 5 secondi che si carichi)

C'è nessuno che sappia dirmi dove trovare lo script (immagino sia in java) o qualcosa di simile?
Grazie

**fcaldera** · 03-09-2006, 19:55

uno script del genere è abbastanza semplice, si può fare ad esempio così:

crea un div e attraverso i CSS imposta una certa altezza (ad es. heigth: 300px), width: 400px; position: absolute; top: -300px; (pari all'altezza per posizionarlo fuori dall'area visibile)

all'evento onload dell'elemento body richiama una funzione che crea il movimento
ad es. <body onload="scrollLayer()">

la funzione scrollLayer() cambierà la proprietà top dell'elemento ad intervalli prestabiliti (attraverso setTimeout) decrementandola da -300 a 0 (o valore superiore)

Ciao paisà

**fcaldera** · 03-09-2006, 20:24

Copia e incolla

codice:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="it" xml:lang="it">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
        <meta http-equiv="Author" 
          content="Fabrizio Calderan, http://www.fabriziocalderan.it/" />
        
        <title>Overlay</title>       
        
        <style type="text/css">
        /* <![CDATA[ */

            html, body {
                margin		: 0;
                padding		: 0;
            }        
            
            #overlay {
                width       : 400px;
                height      : 300px;
                position    : absolute;
                right       : 0;
                top         : -300px;
                background  : #f1f1f7;
                border      : 1px #997 solid;
            }
            
        /* ]]> */
        </style>
        
        
        <script type="text/javascript">
        /* <![CDATA[ */
        
       var finalTopPos = 10; // Posizione Top Finale (i.e. 10px)
       var inertia = 3;         
       var intv; 
    
       function scrollOverlay(px) {
          
            px = (px || 300);
            var ol = document.getElementById('overlay');
            var currTopPos = parseInt(ol.offsetTop, 10);           
            
            if (currTopPos >= finalTopPos) {
                clearInterval(intv);
                return;
            }
            else {
                ol.style.top = (currTopPos + 3) + 'px';
                inertia = parseInt((inertia * 1.1), 10);
                setTimeout('scrollOverlay('+ ol.offsetTop +')', inertia);
            }
       
       }
       
       
        /* ]]> */
       </script>
        
    </head>

<body onload="scrollOverlay()">

    <div id="overlay">
    Overlayer
    </div>
</body>

</html>

Ciao

Discussione: Popup a discesa

Strumenti discussione

Ricerca discussione

Visualizza

Popup a discesa

Permessi di invio