Discussion :

[dhillig]

Bonsoir à tous,
Je réalise en ce moment un site avec le jQuery : ScrollTo. Ça fonctionne terriblement bien. Seul HIC, dans un <div> , je désire faire un diaporama avec l'aide de fancybox.
Et depuis ce diaporama, les effets de ScrollTo ne sont plus fonctionnels Y-a t'il conflit ou est-ce uniquement une questions d'emplacement des scripts ?

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
   	<script src="js/jquery.js" type="text/javascript"></script><!-- Insertion de la bibliotheque jQuery -->
	<script type="text/javascript" src="js/localscroll/jquery.localscroll.js"></script>
	<script type="text/javascript" src="js/localscroll/jquery.scrollTo.js"></script>    
	<script type="text/javascript" src="js/lancement.js"></script><!-- permet le lancement de la fonction de scroll -->
<!--The following script tag downloads a font from the Adobe Edge Web Fonts server for use within the web page. We recommend that you do not modify it.--><script>var __adobewebfontsappname__="dreamweaver"</script><script src="http://use.edgefonts.net/antic:n4:default;actor:n4:default;poiret-one:n4:default;alfa-slab-one:n4:default;anonymous-pro:n4:default;inconsolata:n5:default.js" type="text/javascript"></script>
	<link rel="stylesheet" type="text/css" href="fancybox/jquery.fancybox-1.3.4.css" media="screen" />
	<script type="text/javascript" src="fancybox/jquery-1.4.3.js"></script>
	<script type="text/javascript" src="fancybox/jquery.mousewheel-3.0.4.pack.js"></script>
	<script type="text/javascript" src="fancybox/jquery.fancybox-1.3.4.pack.js"></script>
 
	<script type="text/javascript">
		$(document).ready(function() {
		$('a[rel=diaporama_group]').fancybox({
				'transitionIn'		: 'elastic',
				'transitionOut'		: 'none',
				'titlePosition' 	: 'over',
				'titleFormat'		: function(title, currentArray, currentIndex, currentOpts) {
					return '<span id="fancybox-title-over">Image ' + (currentIndex + 1) + ' / ' + currentArray.length + (title.length ? ' &nbsp; ' + title : '') + '</span>';
				}
			});
 
			$('#LienIframe').fancybox({
				'width' : '75%',
				'height' : '75%',
				'autoScale' : false,
				'transitionIn' : 'none',
				'transitionOut' : 'none',
				'type' : 'iframe'
			});
		});
	</script>

En vous remerciant pour votre aide.
Bonne soirée,
dh

[vandenn3]

Salut,
Je viens de voir que tu insère 2 fois la bibliothèque jquery. Quelle est la version du premier 'js/jquery.js' ?
Est-ce que tout ton code fonctionne si tu supprime js/jquery.js et que tu met l'autre jquery (fancybox/jquery-1.4.3.js) à la place de l'ancien (donc ce sera le premier de la liste des scripts) ?

[dhillig]

Je n'y crois... je n'y crois pas... JE N'Y CROIS PAS !!!! CA MARCHE !!! CLASSE !!! Et moi, ce soir, désespéré : "bah, on va essayer ce que dit vandenn3, ça coute rien". Ça coute rien mais ça rapporte !!!
J'étais persuadé qu'il avait conflit !!! Et pourquoi cela marche t'il en mettant le fancybox - jquery-1.4.3.js en premier ??? Tu peux le dire au monsieur ?
MERCI vandenn3 !!! Par contre, je ne vois pas où est le doublon de biblio JQuery :/
Bon depuis que je suis sur ce site, je ne cesse de faire, refaire défaire et rerefaire ! C'est énervant (et il ne faut pas avoir peur de passer pour un crétin), mais comme j'ai eu l'occasion de le dire à NoSmoking, c'est ne pas céder à la facilité d'un Wordpress et donc la volonté d'apprendre
ENCORE MERCI A TOI (BRAVO !!!) ET AUX AUTRES (NOSMOKING, RYAN ETC...) QUI ME PERMETTENT D'AVANCER !!!!!!
Bonne soirée !!!!
dh

[vandenn3]

Super !

première ligne de ton code:

Code :

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

1
2
3
4
<script src="js/jquery.js" type="text/javascript"></script><!-- Insertion de la bibliotheque jQuery -->
une version de jquery (je ne sais pas laquelle)
plus tard dans le code, tu insère la version 1.4.3:
        <script type="text/javascript" src="fancybox/jquery-1.4.3.js"></script>

tu insère donc 2 fois la bibli dans ton code. il faut donc supprimer un des 2 de préférence celui dont la version est la plus ancienne

[dhillig]

J'ai compris !!! THX !!!
Bonne soirée et bonnes fêtes de fin d'année !!!
GREAT !!!

[dhillig]

Bonjour à tous,
Je me permets de relancer la discussion car j'ai de nouveau le même soucis (qq chose a du m'échapper )
J'ai préféré attaquer deux pages, une avec ScrollTo et la seconde avec Fancybox et Isotope. Au final, j'ai incorporé la "page" Fancybox/Isotope dans la page ScrollTo.
Et depuis, impossible de faire fonctionner Fancybox avec ScrollTo, c'est (selon la biblio) l'un ou l'autre
Le head de la page Fancybox/Isotope :

Code html :

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
<script type="text/javascript" src="lib/jquery-1.10.1.min.js"></script>
<!-- Add mousewheel plugin (this is optional) -->
<script type="text/javascript" src="lib/jquery.mousewheel-3.0.6.pack.js"></script>
<!-- Add fancyBox main JS and CSS files -->
<script type="text/javascript" src="source/jquery.fancybox.js?v=2.1.5"></script>
<link rel="stylesheet" type="text/css" href="source/jquery.fancybox.css?v=2.1.5" media="screen" />
<!-- Add Button helper (this is optional) -->
<link rel="stylesheet" type="text/css" href="source/helpers/jquery.fancybox-buttons.css?v=1.0.5" />
<script type="text/javascript" src="source/helpers/jquery.fancybox-buttons.js?v=1.0.5"></script>
<!-- Add Thumbnail helper (this is optional) -->
<link rel="stylesheet" type="text/css" href="source/helpers/jquery.fancybox-thumbs.css?v=1.0.7" />
<script type="text/javascript" src="source/helpers/jquery.fancybox-thumbs.js?v=1.0.7"></script>
<!-- Add Media helper (this is optional) -->
<script type="text/javascript" src="source/helpers/jquery.fancybox-media.js?v=1.0.6"></script>
<script src="http://isotope.metafizzy.co/beta/isotope.pkgd.js"></script>
<script src="http://isotope.metafizzy.co/beta/bower_components/classie/classie.js"></script>

Le head de la page Scrollto :

Code html :

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

1
2
3
4
5
6
7
8
9
10
11
<script src="js/jquery.js" type="text/javascript"></script><!-- Insertion de la bibliotheque jQuery -->
<script type="text/javascript" src="js/localscroll/jquery.localscroll.js"></script>
<script type="text/javascript" src="js/localscroll/jquery.scrollTo.js"></script>    
<script type="text/javascript" src="js/lancement.js"></script><!-- permet le lancement de la fonction de scroll -->
<link href='http://fonts.googleapis.com/css?family=Roboto:100,300' rel='stylesheet' type='text/css'>
<script type="text/javascript" src="source/jquery.fancybox.js?v=2.1.5"></script>
<link rel="stylesheet" type="text/css" href="source/jquery.fancybox.css?v=2.1.5" media="screen" />
<script type="text/javascript" src="source/helpers/jquery.fancybox-buttons.js?v=1.0.5"></script>
<script type="text/javascript" src="source/helpers/jquery.fancybox-thumbs.js?v=1.0.7"></script>
<script src="http://isotope.metafizzy.co/beta/isotope.pkgd.js"></script>
<script src="http://isotope.metafizzy.co/beta/bower_components/classie/classie.js"></script>

Avec le head suivant, je n'ai plus de ScrollTo

Code html :

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

1
2
3
4
5
6
7
8
9
10
11
<script type="text/javascript" src="lib/jquery-1.10.1.min.js"></script>
<script type="text/javascript" src="js/lancement.js"></script><!-- permet le lancement de la fonction de scroll -->
<script type="text/javascript" src="js/localscroll/jquery.localscroll.js"></script>
<script type="text/javascript" src="js/localscroll/jquery.scrollTo.js"></script>    
<script type="text/javascript" src="source/jquery.fancybox.js?v=2.1.5"></script>
<link rel="stylesheet" type="text/css" href="source/jquery.fancybox.css?v=2.1.5" media="screen" />
<link href='http://fonts.googleapis.com/css?family=Roboto:100,300' rel='stylesheet' type='text/css'>
<script type="text/javascript" src="source/helpers/jquery.fancybox-buttons.js?v=1.0.5"></script>
<script type="text/javascript" src="source/helpers/jquery.fancybox-thumbs.js?v=1.0.7"></script>
<script src="http://isotope.metafizzy.co/beta/isotope.pkgd.js"></script>
<script src="http://isotope.metafizzy.co/beta/bower_components/classie/classie.js"></script>

Et avec ce head, plus de Fancybox

Code html :

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

1
2
3
4
5
6
7
8
9
10
11
<script src="js/jquery.js" type="text/javascript"></script><!-- Insertion de la bibliotheque jQuery -->
<script type="text/javascript" src="js/localscroll/jquery.localscroll.js"></script>
<script type="text/javascript" src="js/localscroll/jquery.scrollTo.js"></script>    
<script type="text/javascript" src="js/lancement.js"></script><!-- permet le lancement de la fonction de scroll -->
<link href='http://fonts.googleapis.com/css?family=Roboto:100,300' rel='stylesheet' type='text/css'>
<script type="text/javascript" src="source/jquery.fancybox.js?v=2.1.5"></script>
<link rel="stylesheet" type="text/css" href="source/jquery.fancybox.css?v=2.1.5" media="screen" />
<script type="text/javascript" src="source/helpers/jquery.fancybox-buttons.js?v=1.0.5"></script>
<script type="text/javascript" src="source/helpers/jquery.fancybox-thumbs.js?v=1.0.7"></script>
<script src="http://isotope.metafizzy.co/beta/isotope.pkgd.js"></script>
<script src="http://isotope.metafizzy.co/beta/bower_components/classie/classie.js"></script>

Dans ce dernier code, si je supprime

Code html :

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

<script type="text/javascript" src="source/jquery.fancybox.js?v=2.1.5"></script>

le scroll fonctionne mais ma barre de navigation n'est plus fixe.
et en supprimant

Code html :

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

<script src="js/jquery.js" type="text/javascript"></script><!-- Insertion de la bibliotheque jQuery -->

, plus d'effet ascenseur ni de barre de navigation lors d'un clic.
D'où plusieurs bibliothèques. Je jongle depuis un moment avec les sources je ne trouve pas la solution.
Quelqu'un aurait une idée du conflit ?
Merci pour votre aide et bonne après-midi,
dh