Visualizzazione dei risultati da 1 a 6 su 6
  1. #1

    Auto scroll/slide orizzontale di una pagina

    Salve a tutti, ho cercato nel forum prima di postare ma non ho trovato nulla che fa al caso mio, mi date un aiuto...

    """devo far scrollare orizzontalmente una pagina larga es.width 2600 px.
    IMPORTANTE deve essere in loop e in auto ... si deve bloccare solo al passaggio del mouse."""" date un'occhiata all'immagine allegata

    avete consigli da darmi o codice da indicarmi per realizzarla?

    Saluti Maurizio e grazie in anticipo.
    Immagini allegate Immagini allegate

  2. #2
    Utente bannato
    Registrato dal
    Apr 2009
    Messaggi
    530
    .. al passaggio del mouse dove? In qualunque posto della pagina (body onmouseover="ferma();")? Si deve presumere che l' utente tenga il mouse fuori campo sulle altre parti del browser, per avviare lo scorrimento?

  3. #3
    Si, infatti ... l'area che scrolla è la parte superiore w=22000px per h=550px ...in basso ci sarà un'area neutra con semplici menù fissi...

    ho corretto l'immagine...
    Immagini allegate Immagini allegate

  4. #4
    nada nada? nessuna idea?

  5. #5
    Utente bannato
    Registrato dal
    Apr 2009
    Messaggi
    530
    Non è che manchino le idee, è che non sempre stiamo coi diti sulla tastiera.
    Intanto abbiamo chiarito che sotto ci vuoi un parte fissa, coi menù; e se vuoi che questi stiano fissi, sarà il caso di far scrollare un DIV, non il BODY (l' intera pagina), che è quello che inizialmente s' era capito dalle tue esaustive (= che rendono esausti) spiegazioni.
    Altrimenti, anche i menù te li vedresti sparire fuori campo.

    Per intanto studiati questo, abbi fede e prega :
    codice:
    <script>
    
     function avvia(){
      q = document.getElementById("quadro");
      q.scrollLeft++;
      t = setTimeout('avvia()', 50); //imposta una temporizzazione, che tra 50 milli-sec. fa ripartire
                                     //la funzione stessa. Il timer deve essere nominato ("t" o altro), affinché
                                     //clearTimeout(); lo possa poi individuare quando andrà arrestato. 
     }
    
     function ferma(){
      clearTimeout(t); // spegne il timer, che individua per il nome dato: t 
     }
    
    </script>
    <body onload="avvia();">
    
    <div id="quadro" onmouseout="avvia();" onmouseover="ferma();" 
      style="width: 100%; height: 300px; overflow: auto; border: 1px dashed red;">
    
     <table width="2600" height="280">
      <td width="30%" bgcolor="blue"></td><td width="30%" bgcolor="yellow"></td><td width="30%" bgcolor="blue"></td>
     </table>
    </div>
    q.scrollLeft++; equivale a dire q.scrollLeft = q.scrollLeft + 1;
    e devi usare questa forma estesa se vuoi incrementare di più di un px "a botta".

    q riassume in se' l' Elemento DIV individuato tramite ID.
    Si potrebbero sostituire le prime due righe con la forma prolissa e più primitiva:

    document.getElementById("quadro").scrollLeft = document.getElementById("quadro").scrollLeft + 3;

    ma anche più intuitiva per i neofiti.
    Vuol dire che il valore di scroll sinistro di quel div, ad ogni passaggio, si rende uguale al proprio attuale valore ripreso, più 3 (pixel).

    Poi però si arriva in fondo ...

  6. #6
    Grazie.... ci provo.... gentilissimo.

    a dopo.

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.