Ciao a tutti, sto realizzando una pagina web dove all'interno ci sono due gallery scorrevoli con frecce, cercando sul web ho trovato stepcarousel che mi permette di fare la gallery come serve a me. Il mio problema è che non riesco a fare entrambe le gallery me ne funziona soltanto una, qualcuno sa dirmi come modificare il codice per farle funzionare entrambe??

codice:

	<script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript"   src="js/jquery-1.4.2.min.js"></script>	
	<script type="text/javascript"   src="js/stepcarousel.js">
            /***********************************************
            * Step Carousel Viewer script- (c) Dynamic Drive DHTML code library 
            (www.dynamicdrive.com)
            * Visit http://www.dynamicDrive.com for hundreds of DHTML   scripts
            * This notice must stay intact for legal use
            ***********************************************/
    </script>
    
	


	<script type="text/javascript">

					
						
	stepcarousel.setup({
	galleryid: 'mygallery', //id of carousel DIV
	beltclass: 'belt', //class of inner "belt" DIV containing all the panel DIVs
	panelclass: 'panel', //class of panel DIVs each holding content
	autostep: {enable:false, moveby:1, pause:300},
	panelbehavior: {speed:500, wraparound:true, persist:false},
	defaultbuttons: {enable: true, moveby: 1, leftnav: ['img/frecceSX.gif', -20,75], rightnav: ['img/frecceDX.gif',70, 75]},
	statusvars: ['statusA', 'statusB', 'statusC'], //register 3 variables that contain current panel (start), current panel (last), and total panels
	contenttype: ['inline'] //content setting ['inline'] or ['ajax', 'path_to_external_file']
})					

					

	</script>
    
    
    
    

	<script type="text/javascript">

	stepcarousel1.setup({
	galleryid: 'mygallery', //id of carousel DIV
	beltclass: 'belt', //class of inner "belt" DIV containing all the panel DIVs
	panelclass: 'panel', //class of panel DIVs each holding content
	autostep: {enable:false, moveby:1, pause:300},
	panelbehavior: {speed:500, wraparound:true, persist:false},
	defaultbuttons: {enable: true, moveby: 1, leftnav: ['img/frecceSX.gif', -20,75], rightnav: ['img/frecceDX.gif',70, 75]},
	statusvars: ['statusA', 'statusB', 'statusC'], //register 3 variables that contain current panel (start), current panel (last), and total panels
	contenttype: ['inline'] //content setting ['inline'] or ['ajax', 'path_to_external_file']
})					

					

	</script>
        
    
    
    <style>
	
.stepcarousel { position: relative;
               
                overflow: hidden; 
                width: 784px; height:166px; }
 
.stepcarousel .belt { position: absolute;
                      }
 
.stepcarousel .panel { float: left;
                       overflow: hidden;
                       margin-left: 0px;
					   margin-bottom:30px; /* Margine attorno ai pannelli */
                       width: 166px; /* Larghezza di ogni pannello,            */
                                     /* se rimosso ogni larghezza viene        */
                                     /* adattata automaticamente al contenuto. */
                     }
#mygallery{
			width:784px;
			left:70px;
}					 
					 
					 

					 
	</style>				 


	
	
</head>

<body>

<div class="contenitoreHP">

			<div class="ritornohome" >
			[img]img/RitornoHome.gif[/img]
    		</div>
    
    
<div class="boxcornice">
    
    		[img]img/completed.gif[/img]
            
     
            
                        <div id="mygallery" class="stepcarousel">
 
  <div class="belt">
    <div class="panel">[img]img/F 1A.gif[/img]</div>
    <div class="panel">[img]img/F 2A.gif[/img]</div>
    <div class="panel">[img]img/F 3A.gif[/img]</div>
    <div class="panel">[img]img/F 4A.gif[/img]</div>


  </div>
 
			</div>

            
           	[img]img/projects.gif[/img] 
            
                        <div id="mygallery" class="stepcarousel1">
 
  <div class="belt">
    <div class="panel">[img]img/F 1A.gif[/img]</div>
    <div class="panel">[img]img/F 2A.gif[/img]</div>
    <div class="panel">[img]img/F 3A.gif[/img]</div>
    <div class="panel">[img]img/F 4A.gif[/img]</div>


  </div>
 
            

            
</div>

			<div class="linkCA">
        	[img]img/LinkContatti.gif[/img]
        	[img]img/architectures-linked.gif[/img]
            </div>
            
            	<div align="right">
         		<p style="font-family:Arial, Helvetica, sans-serif; font-size:7pt; color:#666666">P.IVA 0000000000</p>
               	</div>
       
</div>


</body>
</html>