Discussion :

[seboseboss]

Bonjour

Je doit bien avouer que j'y connais pas grand chose en javascript - jquery et j'ai un soucis sur mon site que je ne sais pas trop comment fixer.

J'ai un site sous xoops et j'uitilise un slider dans mon header

Je n'avais qu'un seul script à la base et il fonctionne très bien indépendamment, maintenant j'ai ajouter un 2eme script pour traiter mes images et le slider ne fonctionne plus.

Voici le code du slider, il est situé dans un fichier html à part qui est appellé par la page theme.html:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
 
    <script type="text/javascript" src="<{xoImgUrl slider/scripts/jquery-1.6.4.min.js}>"></script>
    <script type="text/javascript" src="<{xoImgUrl slider/scripts/jquery.nivo.slider.pack.js}>"></script>
    <script type="text/javascript" src="<{xoImgUrl slider/scripts/jquery.nivo.slider.js}>"></script>
    <script type="text/javascript">	
        $(window).load(function() {
            $('#slider').nivoSlider();
        });
 
    </script>

J'ai essayé de rajouter un jQuery.noConflict(); mais sans succès, je pense plutôt que c'est l'appel de différente librairie qui pose problème.

et voici donc mon second script qui me présente mes images de façon dynamique, mais il à pris le pas sur l'autre script.

Il est situé dans un fichier html de template de module, il est appellé en seconde position par rapport à l'autre script.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
 
	$('.xoopstube_image-wrap img').each(function() {
		var imgClass = $(this).attr('class');
		$(this).wrap('<span class="image-wrap ' + imgClass + '" style="width: auto; height: auto;"/>');
		$(this).removeAttr('class');
	});
 
});
</script>

Donc je voulais savoir comment faire pour éviter les conflits quand on utilise plusieurs script javascript - jquery sur la même page?

Pour infos j'ai donc essayé noconflict, et j'ai essayer de supprimer un des deux appel de librairie mais ça ne fonctionne pas.

Merci d'avance pour votre aide

[SpaceFrog]

regarde du coté de

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

.noClonflict()

Ceci étant c'est une très mauvaise idée d'avoir plusieurs versions de Jquery sur la page ...

[seboseboss]

Il y a certainement quelque chose que je ne fait pas comme il faut

j'ai donc modifier mon slider comme suit:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
 
    <script type="text/javascript" src="<{xoImgUrl slider/scripts/jquery-1.6.4.min.js}>"></script>
    <script type="text/javascript" src="<{xoImgUrl slider/scripts/jquery.nivo.slider.pack.js}>"></script>
    <script type="text/javascript" src="<{xoImgUrl slider/scripts/jquery.nivo.slider.js}>"></script>
    <script type="text/javascript">	
	jQuery.noConflict();
        jQuery(window).load(function() {
            jQuery('#slider').nivoSlider();
        });
 
    </script>

Mais je n'ai aucun changement

Ca vous parait certainement flagrant, mais pas moi, je suis un novice, veuillez m'en excuser.

[SpaceFrog]

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
<script type="text/javascript">	
	var $j=jQuery.noConflict();
        $j(window).load(function() {
            $j('#slider').nivoSlider();
        });
 
    </script>

Mais encore une fois c'est une mauvaise idée d'avoir deux versions de JQuery sur la page ...

[seboseboss]

Merci beaucoup pour ton aide, ça fonctionne,

Pour ce qui est d'utiliser 2 script sur la même page, c'est un peut un problème car xoops appel plusieurs fichiers html pour construire la page, pas de page indépendante, et si on a un script javascript - jquery comme moi dans le header alors c'est toutes les pages du site.

Je ne vois pas comment faire autrement.