utilisation de Fancybox

**antlavoinign** · 11/01/2009, 17h27

Bonjour,
j'essaye depuis une demi-heure d'installer fancybox sur mon site mais je n'y arrive pas!
J'ai bien uploader les fichiers sur mon ftp, j'ai laissé les réglages par défaut, mais quand je clique sur mon image l'effet désiré n'est pas là, quand je clique sur la miniature cela m'amene sur la grande, comme si je n'avais pas installé Fancybox.

Voilà mon code:

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
 
<script type="text/javascript" src="fancybox/jquery.js"></script>
<script type="text/javascript" src="fancybox/jquery.fancybox.js"></script>
<script type="text/javascript" src="fancybox/jquery.pngFix.js"></script>
<link rel="stylesheet" href="fancybox/fancy.css" type="text/css" media="screen">
 
 
<center>
<font color="#878787" face="Arial"><span style="font-size:8pt;">
( cliquer pour zoomer )
<br>
<br>
<a href="images/crea_conceptb.jpg"><img src="images/crea_conceptb_mini.jpg"></a>
<a href="images/crea_radiaclim.jpg"><img src="images/crea_radiaclim_mini.jpg"></a>
<br>
<a href="images/crea_securitycenter.jpg"><img src="images/crea_securitycenter_mini.jpg"></a>
<a href="images/crea_divxfacile.jpg"><img src="images/crea_divxfacile_mini.jpg"></a>
</center>

Comment faire? Tous les chemins vers les JS et le CSS de FancyBox sont bons, je viens de vérifier.
Merci d'avance

**Bovino** · 11/01/2009, 18h23

CTRL+F5 ?

**antlavoinign** · 11/01/2009, 18h28

Quoi, actualiser le cache ?
J'ai actualiser ma page et le résultat est le même.
J'ai l'impression qu'il y a quelque chose d'évident qui m'échappe...

**Bovino** · 11/01/2009, 18h43

Et ton fancybox, tu l'appelles quand ?

**antlavoinign** · 11/01/2009, 19h10

Je suis un peu (beaucoup) une brèle en Ajax, j'ai un peu de mal malgrès la masse d'articles/tutos que je lis dessus.
Alors comment appeller FancyBox ?

**antlavoinign** · 11/01/2009, 19h34

Ok, j'y suis arrivé, il faut inclure les miniatures dans un DIV et ajouter une ligne de Javascript. Merci.

**Tochka** · 05/02/2010, 18h01

Bonjour,
Je me permets de relancer la discussion car j'ai le même problème : lorsque je clique sur une miniature l'image en grand s'affiche mais sans effet fancybox.
Or cela fonctionne parfaitement en local, ainsi que sur l'hébergement sur lequel je l'avais testé à l'origine (chez 1&1), mais pas chez OVH (là où le site doit être installé au final) ni chez online où je l'ai également testé.
Avez-vous une idée d'où cela peut venir ?
Pour info, j'ai déjà testé la lightbox sur cet hébergement et ça fonctionne ...
J'en perds mon latin ...

Merci d'avance pour vos tuyaux !

**Tochka** · 08/02/2010, 13h24

Je suis vraiment bloquée et tourne en rond depuis 48 heures ...
Merci !

**miriouchka** · 15/07/2010, 22h37

Bonsoir,

Je me permets de relancer une fois encore cette discussion car je rencontre exactement le même souci : pas d'activation de l'effet fancybox.

Je débute en développement, j'ai suivi un tuto, qui m'a semblé bien fait. Je ne comprends pas.

La première personne qui a rencontré ce problème disait qu'elle l'avait résolu en mettant les miniatures dans une div (c'est fait) et en ajoutant une ligne de Javascript. Laquelle ?

Voici mon code :

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
<head>
<title>lightbox</title>
	<script type="text/javascript" src="jquery.js"></script>
 
	<script type="text/javascript" src="fancybox/jquery.mousewheel-3.0.2.pack.js"></script>
 
	<script type="text/javascript" src="fancybox/jquery.fancybox-1.3.1.pack.js"></script>
 
    <script type="text/javascript" src="fancybox/jquery.fancybox-1.3.1.js"></script>
 
 
 
	<script type="text/javascript">
 
		$(document).ready(function() {
 
$("a#vignette1").fancybox({
'titleShow': false,
'titlePosition': 'over',
'transitionIn': 'fade',
'transitionOut': 'fade',
'speedIn': 600,
'speedOut': 200,
'overlayShow':true,
}); });
</script>
 
<link href="lightbox_css.css" rel="stylesheet" type="text/css" />
<link href="fancybox/jquery.fancybox-1.3.1.css" rel="stylesheet" type="text/css" />
</head>
 
<body>
 
 
		<div class="ligne">
 
 
			<ul>
				<li><a id="vignette1" href="medias/grande/vignette1.jpg"> <img src="medias/vignette1.jpg" alt="Beau bibou"/></a></li>
				<li><a id="vignette2" href="medias/grande/vignette2.jpg"> <img src="medias/vignette2.jpg"alt="Encore Bibou"/></a></li>
				<li><a id="vignette3" href="medias/grande/vignette3.jpg"> <img src="medias/vignette3.jpg" alt="Toujours Bibou"/></a></li>
			</ul>
 
  </div>
</body>
</html>

Je vous en prie aidez moi, je galère dessus depuis un bon moment et je ne m'en sors pas

Merci pour votre aide

utilisation de Fancybox

jQuery

Discussions similaires

Partager

Partager