Conflitto tra librerie Ajax

[stiffa]

Ciao a tutti. Non essendo esperto di ajax.
Sto usando due script. Uno per far ruotare un banner :
http://spaceforaname.com/galleryview

mentre un altro per fare una pop up ingrandita dell'immagine.

http://phatfusion.net/multibox/

Questi due script sono favolosi. . . ma non riesco a farli funzionare entrambi sulla stessa pagina.

Analizziamo il codice del primo :

nell'head :

<link rel="stylesheet" type="text/css" href="banner_rotator/style.css" >
    
<script type="text/javascript" src="banner_rotator/js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="banner_rotator/js/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="banner_rotator/js/jquery-galleryview-1.1/jquery.galleryview-1.1.js"></script>
<script type="text/javascript" src="banner_rotator/js/jquery-galleryview-1.1/jquery.timers-1.1.2.js"></script>


<script type="text/javascript">
    $(document).ready(function(){
        $('#photos').galleryView({
            panel_width: 998,
            panel_height:257,
            frame_width: 100,
            frame_height: 100
            
        });
    });
</script> 

e nel body :

  <div id="photos" class="galleryview" >
       
   <div class="panel">
      [img]banner_rotator/foto/6.jpg[/img] 
      <div class="panel-overlay">
        <h2>Biciclette elettriche</h2>
        

</p>
      </div>
    </div>
    <div class="panel">
      [img]banner_rotator/foto/2.jpg[/img] 
      <div class="panel-overlay">
        <h2>Monopattino elettrico</h2>
        

</p>
      </div>
    </div>
    <div class="panel">
      [img]banner_rotator/foto/3.jpg[/img] 
      <div class="panel-overlay">
        <h2>Scooter elettrici</h2>
        

</p>
      </div>
    </div>
  
    <div class="panel">
      [img]banner_rotator/foto/4.jpg[/img] 
      <div class="panel-overlay">
        <h2>Esposizione logiss</h2>
        

</p>
      </div>
    </div>
     <div class="panel">
      [img]banner_rotator/foto/5.jpg[/img] 
      <div class="panel-overlay">
        <h2>Trasportatore a catena, nastratrici, rulliera per pallet</h2>
        

</p>
      </div>
    </div>
       
    
        <div class="panel">
      [img]banner_rotator/foto/1.jpg[/img] 
      <div class="panel-overlay">
        <h2>Sollevatori manuali, transpallet, carrelli, piattaforme elevatrice</h2>
        

</p>
      </div>
    </div>
    
    
 
    
   
  </div> 

Analizziamo il codice del secondo:

nell'head

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/mootools/1.2.4/mootools-yui-compressed.js"></script>
    <script type="text/javascript" src="multiBox/lighter/Lighter.js"></script>
    
    <script type="text/javascript">
        window.addEvent('domready', function(){
            $$('code').light({
                altLines: 'hover',
                path: 'lighter/',
                mode: 'ol',
                fuel: 'js',
                indent: 4
            });
        });
    </script>
    
    
    <link rel="stylesheet" href="multiBox/css/multibox.css" type="text/css" media="screen" />
    <!--[if IE 6]>
    <link rel="stylesheet" href="css/multibox-ie6.css" type="text/css" media="screen" />
    <![endif]-->
    <script type="text/javascript" src="multiBox/js/overlay.js"></script>
    <script type="text/javascript" src="multiBox/js/Assets.js"></script>
    <script type="text/javascript" src="multiBox/js/multibox.js"></script>
    <script type="text/javascript">
    
        window.addEvent('domready', function(){
            var box = new multiBox('mb', {
                overlay: new overlay()
            });

            var advanced = new multiBox('advanced', {
                overlay: new overlay(),
                descClassName: 'advancedDesc'
            });
        });
    
    </script> 

e nel body :

<div id="basic">
                [url="multiBox/img/img_5999.jpg"][img]multiBox/img/timg_5999.jpg[/img][/url]
                [url="multiBox/img/img_6608.jpg"][img]multiBox/img/timg_6608.jpg[/img][/url]
                [url="multiBox/img/img_8054.jpg"][img]multiBox/img/timg_8054.jpg[/img][/url]
            </div> 

Se metto entrambi i codici sulla stessa pagina , la popup ajax non funziona piu. Il banner funziona mentre la popup si presenta come apertura classica target="_blank" di un link.

Procedendo in maniera empirica.... ho provato a togliere questa riga :

<script type="text/javascript" src="banner_rotator/js/jquery-1.3.2.min.js"></script> 

e ho notato che la popup(multibox) ha ripreso a funzionare....e chiaramente il banner ha smesso.

Non sapendo piu dove metter le mani ...invoco il vostro aiuto. come posso ovviare a cio' e usare entrambi gli script?

ciao e grazie

[stiffa]

up pls

[cavicchiandrea]

Se devi usare mootools e jquery (anche se io utilizzerei un solo framework) c'è un escamotage per jquery denominato "noconflit" vedi sul sito.

[stiffa]

scusa....potresti essere piu specifico? magari parlando del mio caso?

Perche sto provando aggiungendo le righe di codice su questo sito :
http://api.jquery.com/jQuery.noConflict/


Non riesco a capire come modificare il mio di codice...o dove inserire il nuovo codice.

ciao graz

[cavicchiandrea]

Non conosco jquery cosi bene da essere più preciso.

[stiffa]

qualcun altro? ho provato anche a sostituire al codice del banner rotator...quello che usa jquery .... il $ con jQuery tipo


$(document).ready(function(){ ==========>prima

jQuery(document).ready(function(){ ==========>dopo

per tutte i simboli $ trovati nello script.... pero' a livello di pagina index... non so se bisogna cambiarli anche nei file sorgenti dello script per il banner....


come in alcune letture che ho trovato in rete.... ma nulla...
con questo metodo funziona il banner rotator e non va piu il multibox

un consiglio?

oppure ancora piu facile magari conoscete un framework Ajax che fa tutto quello che farebbe al caso mio.

Semplicemente delle immagini thumbnail che scorrono con le freccette orizzontali e qual'ora cliccassi su una tmb l'immagine si ingrandisce con effetto a popup.

Qualcuno ha qualche dritta?

ciao e graz

[stiffa]

up?

[Vindav]

ti darei anche una mano, ma sinceramente non ho voglia di scaricarmi tutti quei js per fare le prove, e cmq non mi sembra cosi complesso l'uso del noConflict

[stiffa]

vindav...pls help me... non sono tanti i sorgenti...e' tutto qui in alto .... oppure se mi consigli una galleria che scorre, dove se clicco su una tmb si ingrandisce con effetto popup carino.... ti vorro' sempre bene

[stiffa]

niente . a posto. ho trovato una buona lettura

http://www.notodesign.it/jquery-e-mo...-conflict.html

e me la sono cavata usando una variabile cosi

var $j = jQuery.noConflict();


al posto di $


spero possa essere utile a qualcuno
ciaoo