Discussion :

[Rifton007]

Bonjour à vous tous.

Dans le cadre de la création de mon site, j'utilise la fonction LOAD en jQuery pour chager mes pages secondaire dans ma page index.php.

Cela fonctionne parfaitement.

Sauf que maintenant je souhaitre faire l'usage de Lightbox pour l'affiche de certaine image.

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
 
 
<link href="CSS/lightbox.css" rel="stylesheet" type="text/css" media="screen" />
<script type="text/javascript" src="Scripts/jquery.js"></script>
<script type="text/javascript" src="Scripts/prototype.js"></script>
<script type="text/javascript" src="Scripts/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="Scripts/lightbox.js"></script>
 
<script type="text/javascript">
 
$(document).ready(function(){
	$('#DIV_global').load('photos.html')
	});
 
 
function chargeArticle(lien) {
		$('#DIV_global').load(lien);
	 return false;
}
</script>

Malheuresement du jQuery(load) et lightbox ne fonctionne pas ensemble.

Version avec jQuery(load) et lightbox
Dans ce cas si, le jQuery(load) ne fonctionne pas, mais le Lightbox si
Version avec jQuery(load), lightbox désactivé
Et ici le cas contraire, jQuery(load) fonctionne bien sans le Lightbox.

Merci à vous

[Bovino]

Je dirais surtout que si tu utilises jQuery et Prototype ensemble, la fonction $ rencontre quelques conflits
Vas déjà voir du coté de noConflict !

[Rifton007]

Merci de ta réponse, je donc suivit ton conseils, mais le probléme persiste.

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
 
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
 
<script type="text/javascript" src="Scripts/jquery.js"></script>
<script type="text/javascript" src="Scripts/prototype.js"></script>
<script type="text/javascript" src="Scripts/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="Scripts/lightbox.js"></script>
<script type="text/javascript">
 
jQuery.noConflict();
jQuery(document).ready(function(){
 
	jQuery('#DIV_global').load('photos.html')
	});
 
 
function chargeArticle(lien) {
		jQuery('#DIV_global').load(lien);
	 return false;
}
</script>

[danielhagnoul]

Bonsoir.

Pour que noConflict() fonctionne, jQuery doit être le dernier framework déclaré.

Essayer ceci :

Code :

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

1
2
3
4
5
6
 
	(function($){
		$(document).ready(function(){
			$('#DIV_global').load('photos.html')
		});
	})(jQuery);

C'est une "closure" (que l'on peut traduire par clôture) jQuery, elle attribue $ uniquement à jQuery

[Rifton007]

Super ça fonctionne, encore mille fois merci.