Spostare un elemento con javascript

  • Creatore Discussione Creatore Discussione Fxxxx
  • Data di inizio Data di inizio

Fxxxx

Utente Attivo
17 Set 2011
63
0
0
Ciao a tutti
volevo creare una specie di galleria immagini in orizzontale...
Codice HTML:
HTML:
<div id="galleria">
                <div id="roller">
                	<div id="riga1" class="riga">
                    	<a href="http://forum.mrwebmaster.it/images/a01.jpg" rel="shadowbox"><img src="http://forum.mrwebmaster.it/images/a01.jpg" /></a>
                        <a href="http://forum.mrwebmaster.it/images/a04.jpg" rel="shadowbox"><img src="http://forum.mrwebmaster.it/images/a04.jpg" /></a>
                        <a href="http://forum.mrwebmaster.it/images/a07.jpg" rel="shadowbox"><img src="http://forum.mrwebmaster.it/images/a07.jpg" /></a>
                        <a href="http://forum.mrwebmaster.it/images/a10.jpg" rel="shadowbox"><img src="http://forum.mrwebmaster.it/images/a10.jpg" /></a>
                        <a href="http://forum.mrwebmaster.it/images/a13.jpg" rel="shadowbox"><img src="http://forum.mrwebmaster.it/images/a13.jpg" /></a>
                	</div>
                	<div id="riga2" class="riga">
                    	<a href="http://forum.mrwebmaster.it/images/a02.jpg" rel="shadowbox"><img src="http://forum.mrwebmaster.it/images/a02.jpg" /></a>
                        <a href="http://forum.mrwebmaster.it/images/a05.jpg" rel="shadowbox"><img src="http://forum.mrwebmaster.it/images/a05.jpg" /></a>
                        <a href="http://forum.mrwebmaster.it/images/a08.jpg" rel="shadowbox"><img src="http://forum.mrwebmaster.it/images/a08.jpg" /></a>
                        <a href="http://forum.mrwebmaster.it/images/a11.jpg" rel="shadowbox"><img src="http://forum.mrwebmaster.it/images/a11.jpg" /></a>
                        <a href="http://forum.mrwebmaster.it/images/a14.jpg" rel="shadowbox"><img src="http://forum.mrwebmaster.it/images/a14.jpg" /></a>
                	</div>
                	<div id="riga3" class="riga">
                    	<a href="http://forum.mrwebmaster.it/images/a03.jpg" rel="shadowbox"><img src="http://forum.mrwebmaster.it/images/a03.jpg" /></a>
                        <a href="http://forum.mrwebmaster.it/images/a06.jpg" rel="shadowbox"><img src="http://forum.mrwebmaster.it/images/a06.jpg" /></a>
                        <a href="http://forum.mrwebmaster.it/images/a09.jpg" rel="shadowbox"><img src="http://forum.mrwebmaster.it/images/a09.jpg" /></a>
                        <a href="http://forum.mrwebmaster.it/images/a12.jpg" rel="shadowbox"><img src="http://forum.mrwebmaster.it/images/a12.jpg" /></a>
                        <a href="http://forum.mrwebmaster.it/images/a15.jpg" rel="shadowbox"><img src="http://forum.mrwebmaster.it/images/a15.jpg" /></a>
                	</div>
                </div>
                <div id="control">
                	<a href="#" onClick="document.getElementById('roller').style.webkitTransform='translate(-100px,0px)';">Scorri</a>
                </div>

Dove c'è un div galleria che contiene un roller che è quello che si deve spostare per consentire di mostrare altre foto che sono a destra...
La funzione del control è quello di contenere un div in link che permette di spostare il div roller verso sinistra...

Mi funziona ma quando provo a cliccare di nuovo sul link non si sposta più perché è già stato spostato...


Come posso fare ?
Se avete qualche alternativa scrivete pure il codice...

Ciao e grazie
 
Ultima modifica:

Discussioni simili