[RÉGLÉ] Conflit entre deux JQuery...

[claire39]

Bonjour à tous!

je me retrouve avec un problème pas nouveau, mais que je n'arrive pas à solutionner seule, sans doute par manque de pratique avec tout ce qui touche à Javascript.

1/ j'ai bidouillé un joli effet de fade in/out sur des images grâce à un tuto, et pour cela j'ai inséré dans mon template un appel à JQuery (dans le dossier JS de mon template). nice.

2/ j'ai envie d'un carrousel sur la page d'accueil, qui utilise li aussi JQuery, mais je n'ai pas trouvé où il va chercher la librairie.

Sur la page d'accueil du site, j'ai donc 2 appels différents à JQuery, donc forcément, ça ne fonctionne pas.

J'ai trouvé quelque part qu'il fallait insérer

<script type="text/javascript">jQuery.noConflict();</script>

dans mon template, ce qui a pour effet de faire fonctionner le carrousel et de planter mon bel effet sur les vignettes.

Le carrousel utilisé est le module "Lof ArticlesSlideShow".
Est il possible que mon carrousel fonctionne sur la même page que mes jolies vignettes?
Et comment est ce que je réussis cette prouesse?

merci de votre aide, même si ce sujet est récurent!

[claire39]

Re : Conflit entre deux JQuery...

En fouillant encore plus, je trouve ma réponse directement sur http://api.jquery.com/jQuery.noConflict/

mon erreur était de ne pas associer $.noConflict(); au reste de mon script javascript dans le header.

donc en mêlant les deux, j'obtiens ça:

<script type="text/javascript">
 $.noConflict();
jQuery(document).ready(function($) {



// le bout de js qui génère mon effet fade in/out
$(document).ready(function(){
$("img.a").hover(
function() {
$(this).stop().animate({"opacity": "0"}, "slow");
},
function() {
$(this).stop().animate({"opacity": "1"}, "slow");
});

});
});

</script>

ouf!