11480 sujets

JavaScript, DOM et API Web HTML5

Bonjour tout le monde.
Alors depuis deux jours je suis en train de chercher une façon de comprendre pourquoi mon Slideshow et ma Lightbox ne fonctionnent pas ensemble.

J'ai premièrement utilisé TinySlideShow avec Lightbox2 puis avec Lightview.
J'ai ensuite utilisé Slideview avec Fancybox puis avec Prettyphoto. (jQuery pour les 3 derniers)

A mon grand bonheur, je trouve ceci :

http://www.alsacreations.com/astuce/lire/79-comment-lancer-plusieurs-fonctions-au-chargement-dune-page.html

Qui est un de vos articles, mais je ne vois pas comment l'utiliser avec mon code, surtout à cause du Slideshow. Je souhaite réutiliser ma première initiative soit "TinySlideShow" avec "Lightbox2" mais, je ne vois pas comment je peux utiliser l'initialisation de TinySlideShow vu que c'est un "amas" de choses, et que niveau javascript je n'y connais pas grand chose...

Donc je vous laisse voir par vous-même en espérant que vous pourrez m'aider.

Code obfusqué


Pour l'initialisation de la Lightbox c'est : "initLightbox();"
Et si vous voulez voir le problème que ça donne c'est sur mon domaine où je fais mes essais :
http://tkarts.free.fr/folio

Je vous remercie d'avance pour votre gentillesse à m'aider ! Smiley smile
Modifié par Trukrone (15 Jan 2017 - 16:10)
C'est toujours une source d'ennui d'utiliser des librairies différentes, et souvent non-compatibles entre elles. Tu devrais faire le choix d'une librairie (jQuery, prototype, Dojo, Yahoo, etc… ) et regarder si des modules existants correspondraient à tes besoins.

Via jQuery, j'ai utilisé sans problème un slideshow et une modalbox (FancyBox) :
http://www.trivandanam.net/seb/v5/#portfolio
Justement les deux derniers que j'ai essayé sont des ensembles avec jQuery.

Comme Slideview avec Fancybox, ou Slideview avec Prettyphoto.
Modifié par Trukrone (14 Jul 2010 - 14:06)
Trukrone a écrit :
Justement les deux derniers que j'ai essayé sont des ensembles avec jQuery

Ah ok, car dans ta démo tu utilisais deux librairies différentes, mais en regardant les specs de LightView, je viens de me rendre compte qu'il nécessite les deux librairies. Par contre, tu utilises aussi TinySlideShow qui peut être source de conflit avec les librairies chargées.

D'ailleurs, dès la mise en place (excessivement longue) du slideshow sur ton exemple, une erreur est renvoyée :

Erreur : element is null
Fichier Source :  http://tkarts.free.fr/folio/js/prototype.js
 
Ligne : 4619


Sinon, j'ai regardé un peu slideview, et même dans la page de démo de son développeur, c'est pas terrible et ça déconne pas mal (il zappe des images en avant et en arrière). Parfois, il vaut mieux créer ses propres scripts : jQuery est par exemple assez flexible pour permettre la création d'effets et d'actions simples.
Par contre, pour une modalbox je te conseille FancyBox. PrettyPhoto est bien aussi, mais j'ai du utiliser une version modifiée pour la rendre compatible avec jQuery 1.4.2…
ZeB_panam a écrit :

D'ailleurs, dès la mise en place (excessivement longue) du slideshow sur ton exemple, une erreur est renvoyée :

Erreur : element is null
Fichier Source :  http://tkarts.free.fr/folio/js/prototype.js
 
Ligne : 4619



Il n'y a que 4221 lignes dans ce script... Comment est-ce possible ??? :o

J'ai mis une demo avec Slideview et Fancybox ici si tu le souhaites :
http://tkarts.free.fr/folio2

Ce qui m'embete c'est que je n'ai trouvé que ces deux scripts là qui correspondent à mes attentes... Smiley ohwell

Hmm... donc selon toi, le seul moyen de réussir à combiner un slideshow et une lightbox, serait que je fasse mon propre script ? Smiley sweatdrop
Trukrone a écrit :

Hmm... donc selon toi, le seul moyen de réussir à combiner un slideshow et une lightbox, serait que je fasse mon propre script ?

Non, puisque j'ai utilisé deux plug-in pour le faire (voir le lien de mon portfolio que je t'ai mis un peu plus haut…).


Sinon, dans ta démo tu appelles plusieurs fois les mêmes scripts :

<!-- celui-ci -->
<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="/fancybox/jquery.easing-1.3.pack.js"></script>
<!-- et celui-ci aussi -->
<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>


Du coup, ça renvoie une erreur :
(j'ai testé chez moi, l'appel au script ne comporte pas d'erreur, c'est donc bien un conflit)

Erreur : showItem is not defined
Fichier Source :  http://tkarts.free.fr/folio2/js/jquery.galleryview-2.1.1.js
 
Ligne : 637



Et il n'y a pas que 4221 lignes dans prototype.js, mais 4874… Mais peu importe la ligne renvoyée, c'est le conflit de script qui fait planter prototype.js.
Tu devrais installer Firebug et WebDeveloper pour debugger, ce sera plus simple pour toi.
J'ai réessayé sous jQuery avec un autre Slideshow appelé "Galleria", et la lightbox "Fancybox".

Cette fois-ci je n'ai aucune erreur javascript, vérifié avec Firebux et Webdevelopper.
Et je n'arrive pas à cliquer sur l'image pour l'agrandir, l'aurais-je mis au mauvais endroit ?

Je l'ai uploader ici : http://tkarts.free.fr/folio2

Et voici le code :

Code obfusqué.

Modifié par Trukrone (15 Jan 2017 - 16:11)