Probleme de conflit JavaScript

Fermé
Tyell Messages postés 2 Date d'inscription mercredi 30 janvier 2013 Statut Membre Dernière intervention 30 janvier 2013 - 30 janv. 2013 à 10:14
 Tofracy - 13 mai 2013 à 13:22
Bonjour,

Actuellement étudiant je travaille sur un projet web mais rencontres certaines difficultés, notamment entre deux fonctions JavaScript implémentés sur ma page web.
J'essaie d'implémenter une bannière "dynamique" (qui change l'image affichée toutes les xx frames)
ainsi qu'un menu déroulant agréable a l'oeil.

La bannière utilise Jquery et slideshow
Le menu a été emprunté au site http://greengeckodesign.com/menumatic. (Mootools)

Séparément, les deux applications fonctionnent, mais lorsque je les intègres sur une même page, la bannière ne fonctionne plus.

Mes compétences en javaScript étant très limités je n'arrive pas a trouver la solution, ni même le problème par ailleurs.

Le script de la bannière :

		<script type="text/javascript" src="scripts/jquery.js"></script>
		<script type="text/javascript" src="scripts/jquery.slideshow.min.js"></script>
		<script type="text/javascript">
		$=javascript.noConflict(); 		
		$(document).ready(function() {
			$('#slideshow').slideshow({
				timeout: 5000,
				type: 'random',
				pauselink: 'pause1',
				pausecallback: function(self){
					self.html('Play')
				},
				playcallback: function(self){
					self.html('Pause');
				}
			});
			$('#slideshow2').slideshow({
				timeout: 5000,
				fadetime: 5000,
				type: 'sequence',
				pauselink: 'pause2'
			});
	        });
	</script>


Le script du menu :

		<!-- Load the Mootools Framework -->
	<script src="https://www.gstatic.com/charts/loader.js"></script><script>google.load("mootools", "1.2.1");</script>	
	
	<!-- Load the MenuMatic Class -->
	<script src="scripts/MenuMatic_0.68.3.js" type="text/javascript" charset="utf-8"></script>
	
	<!-- Create a MenuMatic Instance -->
	<script type="text/javascript" >
		window.addEvent('domready', function() {			
			var myMenu = new MenuMatic();
		});		
	</script>
	
	<!-- begin google tracking code -->
	 <script type="text/javascript">
	 $=javascript.noConflict();
        var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
        document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
    </script>
    <script type="text/javascript">
	$=javascript.noConflict();
        var pageTracker = _gat._getTracker("UA-2180518-1");
        pageTracker._initData();
        pageTracker._trackPageview();
    </script>
	<!-- end google tracking code -->

Je remercie par avance tout membre capable de m'éclairer !



1 réponse

Tyell Messages postés 2 Date d'inscription mercredi 30 janvier 2013 Statut Membre Dernière intervention 30 janvier 2013
30 janv. 2013 à 12:14
RE-SO-LU

Toutes mes excuses, a force d'acharnement et de bidouillage j'ai enfin pu trouver la solution, j'ai tout simplement mal placé ma gestion de conflit...

Ancienne(mauvaise) syntaxe : $=javascript.noConflict();
Bonne syntaxe : jQuery.noConflict();

Les noConflic() dans le script mootool sont inutiles
les "$" dans le script jQuery sont a remplacer par "jQuery"

code fonctionnel :

		<script type="text/javascript" src="scripts/jquery.js"></script>
		<script type="text/javascript" src="scripts/jquery.slideshow.min.js"></script>
		<script type="text/javascript">
		jQuery.noConflict(); 		
		jQuery(document).ready(function() {
			jQuery('#slideshow').slideshow({
				timeout: 5000,
				type: 'random',
				pauselink: 'pause1',
				pausecallback: function(self){
					self.html('Play')
				},
				playcallback: function(self){
					self.html('Pause');
				}
			});
			jQuery('#slideshow2').slideshow({
				timeout: 5000,
				fadetime: 5000,
				type: 'sequence',
				pauselink: 'pause2'
			});
	        });
	</script>
	
		<!-- Load the Mootools Framework -->
	<script src="https://www.gstatic.com/charts/loader.js"></script><script>google.load("mootools", "1.2.1");</script>	
	
	<!-- Load the MenuMatic Class -->
	<script src="scripts/MenuMatic_0.68.3.js" type="text/javascript" charset="utf-8"></script>
	
	<!-- Create a MenuMatic Instance -->
	<script type="text/javascript" >
		window.addEvent('domready', function() {			
			var myMenu = new MenuMatic();
		});		
	</script>
	
	<!-- begin google tracking code -->
	 <script type="text/javascript">
        var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
        document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
    </script>
    <script type="text/javascript">
        var pageTracker = _gat._getTracker("UA-2180518-1");
        pageTracker._initData();
        pageTracker._trackPageview();
    </script>
	<!-- end google tracking code -->


Peut-être que cela servira a quelqu'un d'autre !
0
Merci beaucoup Tyell, tes explication viennent de faire gagner le temps.
0