Discussion :

[Joupi]

Bonjour à tous,

je ne suis pas programmeur, et je tâtonne. J'avance petit à petit en css, php.
Mais je n'y connais pas grand chose en javascript.

Voici donc mon soucis : j'essaye d'intégrer dans un site wordpress un menu et un slider.
Chacun fonctionne très bien, mais séparément. Lorsque les deux sont ensembles, un seul fonctionne (en l’occurrence le slider).
Désolé, je n'ai pas de site à montrer car je fais les essais en local.
J'espère que ces petits bouts de code pourront être suffisants.

Voilà donc le code qui semble poser problème (j’explique en peu plus bas pourquoi). Il est à la fin du code de la page.

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
 
...
 
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.1/jquery-ui.min.js"></script>
 
 <!-- jQuery menu -->
    <script type="text/javascript" src="<?php echo get_template_directory_uri(); ?>/js/sf/hoverIntent.js"></script>
    <script type="text/javascript" src="<?php echo get_template_directory_uri(); ?>/js/sf/superfish.js"></script>
 
<!-- Slider -->
    <script type="text/javascript" src="<?php echo get_template_directory_uri(); ?>/scripts/jquery.min.js"></script>
    <script type="text/javascript" src="<?php echo get_template_directory_uri(); ?>/scripts/jquery.mobile.customized.min.js"></script>
    <script type="text/javascript" src="<?php echo get_template_directory_uri(); ?>/scripts/jquery.easing.1.3.js"></script> 
    <script type="text/javascript" src="<?php echo get_template_directory_uri(); ?>/scripts/camera.min.js"></script> 	
 
 
 
<!--  jQuery Slider -->
    <script>
		jQuery(function(){
			jQuery('#camera_wrap_2').camera({
				height: '190px',
				loader: 'bar',
				thumbnails: true,
				loaderOpacity: .4,
				barDirection: 'leftToRight',
				fx:'blindCurtainSliceTop',
			});
		});
	</script>
 
 
 
 
 <!--  jQuery menu -->
	<script>
 
		jQuery(function(){
			jQuery('#example').superfish({
				//useClick: true
			});
		});
 
		</script>	
 
 
</body>
</html>

Alors je sais, vous aller me dire que c'est le bazar , et que certains jquery sont appelés plusieurs fois.

En cet état, le slider fonctionne, mais le menu s'affiche, mais n'a pas de fadein, etc et donc il semble ne pas se servir du jquery.

Pour qu'il fonctionne, il faut que je supprime les lignes :

Code :

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

1
2
3
4
5
 
<!-- Slider -->
    <script type="text/javascript" src="<?php echo get_template_directory_uri(); ?>/scripts/jquery.min.js"></script>
 
</html>

et

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
<!--  jQuery Slider -->
    <script>
		jQuery(function(){
			jQuery('#camera_wrap_2').camera({
				height: '190px',
				loader: 'bar',
				thumbnails: true,
				loaderOpacity: .4,
				barDirection: 'leftToRight',
				fx:'blindCurtainSliceTop',
			});
		});
	</script>

Mais dans ce cas, bien sûr, plus de slider.

Il semble donc que ce soit une sorte de conflit jquery.

Il faudrait peut-être donc que je simplifie l'appel des jquery.
Mais voilà le soucis : lorsque j'enlève la ligne d'accès au jquery.min.js du slider, il ne fonctionne plus.

Il y a peut-être aussi un soucis d'ordre des scripts, car si je déplace le script du slider avant celui du menu, par exemple, il ne fonctionne plus.

Bref, je m'excuse si je ne suis pas clair, mais j'espère tout de même avoir un peu de votre aide.

En vous remerciant par avance.

[Lorenzo77]

salut,

tu dois avoir un conflit de version ou tout simplement une erreur de version pour un composant précis.
commence par verifier que tes composants (les 2 !) sont codés pour cette version de jQ et de jQ UI :

Code :

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

1
2
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.1/jquery-ui.min.js"></script>

si c'est pas le cas alors recup une version a jour de ton slider et menu !

si ca n'existe pas, alors la seule soluce restante est un :

Code :

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

1
2
3
$ = jQuery.noConflict();
$(function(){
......

a utiliser avant l'execution des blocs de code demandant une version différente de jQ (aprés insertion de la bonne version)

[Joupi]

Bonjour Lorenzo, et merci pour ta réponse.

en effet, c'est un problème de version.

Si je supprime le jquery du slider, et que je remplace celui de google par jquery-1.8.3.min.js, le menu et le slider fonctionne.
C'est donc un problème de compatibilité entre le slider et jquery 1.9.1.
Et il semble qu'il n'y ait pas de version compatible.
Flûte.

Encore merci.