grafikart/zoombox

Zoombox is an easy to use Javascript class that allow you to overlay images and videos on the current page.

Zoombox

Zoombox is an easy to use Javascript class that allow you to overlay images and videos on the current page.

To see more information on how to use and install zoombox please visite : http://grafikart.github.io/Zoombox/

zoombox's Issues

Fermeture de la "Zoombox" lors du chargement d'une image

Salut,

Petit bug qu'il me parait important de signaler,
Lors du clique sur l'overlay (#mask) pendant le chargement d'une image, la "zoombox" se ferme et bug ( Elle ne veux plus se relancer + bug visuels ).

Pour reproduire le bug :
Ouvrir un zoombox en mode galerie, lorsque la première image est chargée, cliquez sur une autre miniature du mode galerie, et lors du chargement de celle-ci, cliquez sur l'overlay.

Zoombox -> iframe -> Thumbnails zgallery

Bonjour, sur le site :
http://ericleguen.com/1/index.html

vous verrez le problème sur la première image cliquable de la section "Concert".
Là je link une page Html qui apparaît dans la zoombox.
Est-il possible d'avoir son imagette dans la zgallery ?

Par ailleurs je saisis mal la nuance entre une "Iframe" et un "html content"...

En attente de réponse, merci pour votre site, à partir duquel (tutoriel site "one page")
j'élabore le mien...

Iguanodon2012

Le lien sur la page readme

Le lien sur la page Readme n'est plus valable ^^

test

test

Scroll vertical

Hello,

Il serait intéressant de pouvoir caler l'image par rapport à sa largeur (sans dépasser la largeur du viewport) et de pouvoir scroller verticalement, ce serait intéressant dans le cas ou les images sont beaucoup plus hautes que larges

dispatcher les scripts

bonjour,
est-il possible de modifier l'emplacement du fichier zoombox.css pour integrer ce module à un framework? Apparement changer le lien du css dans le header ne suffit pas.

Affichage des images dans le bandeau de la gallerie

salut
j'utilise zoombox pour afficher une gallerie de 15 photos, cela fonctionne bien. Mais si j'affiche une des dernières images, alors les premières photos de la gallerie ne sont plus visible dans le bandeau. La première image du bandeau des images de la gallerie est en fonction de l'image affichée en grand dans la zoombox, peut on paramétrer ce recentrage ?
Merci

Zoombox et Wordpress : page not found

Salut, j'ai d'abord suivi ton tuto sur la création d'un theme avancé. J'ai notamment mis en place le portfolio qui recupere les images d'un post. Du coup, j'aurais aimé adapté zoombox pour que lors du clic sur une image du portfolio, cette derniere s'agrandisse. J'ai donc simplement inclut le zoombox.js et css et j'ai mis la ligne ci-dessous dans mon site.js:

$(function(){
$('img').zoombox({
theme:'zoombox',
opacity: 0.8,
duration:800,
animation:true,
width:600,
height:400,
gallery:true,
autoplay:false
});
});
donc je cible toutes les images du site pour tester. Quand je clique sur une image que j'ai mis en index: code HTML:

/images/fondOpenning.jpg" alt="la trousse du web" />

Zoombox "fonctionne" dans le sens où le fond se noircit bien et la fenetre s'ouvre avec l'effet, mais à la place de mon image, j'obtient une erreur 404. Donc je me demandait où zoombox recupere ses liens? est-ce les liens absolus de Wordpress qui l'empeche de trouver l'image?

Merci pour tout tes tutos, j'adore t'as façon de penser le web et de partager tes sources gratuitements (2€ pour tout ce que tu propose, c'est donné, content de te payer une bière chaque mois ^^).

Petit soucis dans la logique de la fonction Open()

Zoombox fonctionne très bien avec option.animation = true mais en mode gallery avec les animations désactivées les images suivantes ne se chargent pas.

probleme avec zoombox qui ne marche pas du tout

Bonjour,

apres avoir regarde la vidéo sur youtube, jai re vérifier le tt et ces correct. mais le zoombox ne fonction pas lors du click il ne se produit rien du tt???

svp jai besoin daide

voici comment est mon lien (cest pour mon portefolio) :

SVP ou est le prob

merci

Page introuvable

Bonjour,

Les liens http://www.grafikart.fr/pages/zoombox et http://www.grafikart.fr/zoombox affichent "Page introuvable" au niveau du tuto et sur le README.md.

différence importante entre la vidéo et le résultat

Bonjour,

Comme suggérer à la fin de la vidéo, je prends le temps de t'écrire ma question en commentaire dans cette rubrique. Il y a une différence importante entre ce que je vois dans la vidéo et le résultat, au niveau des miniatures de la galerie.

Dans ta vidéo, celles-ci apparaissent sur l'agrandissement de l'image, dans sa partie du bas et lors de son survol. Une fois ma galerie crée, mon résultat est tout autre. La galerie s'affiche tout en bas de la page et non plus en bas de la photo. Ce qui est tout de suite graphiquement moins intéressant.

Pourquoi ce changement de mise en page entre la démonstration dans la vidéo et le résultat final lorsque je mets en place les scripts ? C'est évidement le résultat comme présenté dans la vidéo qui m'intéresse.

J'ai testé tous les thèmes ainsi que plusieurs navigateurs.

Bonne journée.

JMN

Problème internet explorer 8, 7

Bonjour,
merci pour ce super scripts, cependant j'ai un soucis lorsque je ferme la fenêtre pas sous IE 9, sous IE 8 et IE 7.

Dans le debug j'ai ce message :
SCRIPT87: Argument non valide.
jquery.min.js, Ligne 16 Caractère 79224

Est surligné en jaune : a.elem.style[a.prop]=

J'ai l'impression que le problème vient de la version de Jquery, après je peux me tromper.

Merci d'avance

html content

slt,
lorsque l'on ferme zoombox, après l'utilisation de $.zoombox.html, il devient impossible de la réouvrir sans avoir à recharger la page.
Par exemple sur ta page "http://www.grafikart.fr/zoombox", le lien HTML content devient inactif après la fermeture de la boite.
Nicolas C.

Probleme Chrome et Safari

Bonjour,
J'ai un pb avec Chrome sur le portfolio de mon site... ça marche sur tous les navigateurs sauf celui-ci...
euh en plus j'ai regardé le tuto... et tu le fais sur chrome... :.(
le developer tool me met une erreur ligne 173 sur zoombox.js avec une chaine se terminant par has no method 'attr'

voici l'url http://www.hazartwebdesign.com/#portfolio

merci? :)

ouvrir zoombow sans le tag 'a'.

Bonjour,

C'est n'est pas vraiment une issue, mais je n'arrive pas à utiliser GIT pour créer une branche du projet.
Cette outil me semblait vraiment bien fait, je l'ai donc l'utiliser sur un site de test pour voir se que ça peux donner.

Un des problème que j'ai croisé, c'est qu'il n'est pas possible d'utiliser zommbox sur un tag 'img'. J'ai alors simplement ajouté la ligne suivante dans le fichier "zoombox.js":

[CODE]
$.fn.zoombox = function(opts){
...
// vers la ligne 107

link = elem.attr('href');
if (link == undefined) link = elem.attr('src'); // nouvelle ligne qui permet d'utiliser zoombox sur un tag 'img'.
imageset = tmpimageset;
...
[/CODE]

Je me demande parcontre si cela peu apporter des bug particuliers.
Je n'active pas zoombox sur tout les tag image mais seulement ceux avec une classe défini.
Sinon j'imagine que ça pourrai faire boucler sans fin zoombox :s.

Gérer plusieurs sources d'une même vidéo.

Bonjour et tout d'abord un grand merci pour tes vidéos avec lesquelles je progresse énormément.

Concernant zoombox, il y a un truc que je n'arrive pas à gérer :
J'ai créé un site pour des musiciens qui ont, entre autre, une vidéo à montrer. Cette video est stockée sur le serveur, et j'ai plusieurs format de la vidéo (.ogg, . mp4, et .webm) pour que tout les navigateurs s'y retrouvent.
Mais avec zoombox, je sais pas créer un seul lien pour toutes ces sources. A vrai dire je ne sais pas si cela est possible.
Une idée ?
Merci.

Peut on ajouter une galerie pour chaque link ?

Bonjour,
J'ai suivi le tuto zoombox et cela fonctionne. Cependant ma problématique serait de pouvoir obtenir pour chaque visuel qui s'affiche, une galerie interne de 2-3 images dans ma zoombox. Pour que chaque lien de ma galerie soit un projet. Il me semble que c'est ce qui est écrit en bas avec zgallery1{nom de ma galerie}. Est-ce possible ? Si oui comment l'appliquer ?
Merci d'avance.

soumission d'un formulaire dans la zoombox

Bonjour
est il possible de soumettre un formulaire avec envoi des données dans une zoom box?
j'ai fait un essai avec
$(function(){
$('form.zoombox').zoombox();
});
lors de la soumission du formulaire, la zoombox s'ouvre, mais un message affiche que la page n'existe pas..
mon formulaire

je souhaiterais que le formulaire soit soumis dans une nouvelle zoombox à l'adresse du post du formulaire merci

Passage de variable entre page principale et contexte zoombox

Salut,

Je tente d'utiliser la zoombox pour un projet scolaire et je me demandais si ce que j'essaye de faire est possible...

Jai une page web qui affiche des objets JS dont j'ai fait les classes moi-même et j'instancie ces objets dans le script de ma page web.
Je veux que ces objets soient créés à partir de paramètres entrés par l'utilisateur et du coup, je voulais afficher un formulaire dans la zoombox pour faire entrer ces paramètres. Mon but c'est que le submit du formulaire ferme la zoombox mais que je puisse récupérer les paramètres entrés pour créer mes nouveaux objets dans la page principale.
Est-ce que c'est possible de faire ça ? Je peux récuperer les valeurs entrées dans mon formulaire dans le contexte de la page ? (peut-etre en interceptant l'event de fermeture de la box ou l'event de submit du formulaire ?)

J'espere que ce que j'ecris est compréhensible.. et que c'est possible ^^
Merci d'avance pour la réponse.

navigation entre fenêtres

Bonjour,

J'ai 3 liens qui s'ouvrent avec Zoombox: contact, cgv, et boite à idée.
J'aurais voulu avoir les flèches de navigation gauche et droite quand j'utilise la fonction galerie mais cela ne fonctionne pas

Quelqu'un pourrait-il m'aider ?

Merci

video YouTube ne fonctionne plus

les videos YouTube ne fonctionnait plus, car le lien js est en http et pas https, j'ai changé la ligne 472 de zoombox.js par

content='<iframe width="'+width+'" height="'+height+'" src="https://www.youtube.com/embed/'+id+'wmode=Opaque" frameborder="0" allowfullscreen></iframe>';

Ne marche pas

Bonjour,

Vraiment désolé mais j'ai beau tout faire chez moi, rien ne marche ..!..

• J'ai bien up les fichiers JS et CSS
• Je les ai bien inclus
• J'ai bien initialisé jquery
• J'ai bien mis la classe zoombox...

J'ai un autre "plugin jquery ou j'ai une phrase d'initialisation, j'ai essayer de mettre $('a.zoombox').zoombox(); dedans mais sans succes non plus ..

Merci

Miniatures zgallery en double

Assez étrange:

J'ai un foreach qui me découvre 4 images et les miniatures sont doublée, dans la partie gallerie j'ai 8 images ...

Si quelqu'un connait

Soucis avec Zoombox

n° de version dans les sources

Bonjour,

Déjà merci pour le boulot, très sympa comme outils.

Un truc bête mais quand même indispensable, serait d'avoir le n° de version dans le fichier source. Histoire de savoir si on doit faire une mise à jour.

Merci

Décalage de l'image

Salut !

Alors j'ai deux problème :

• quand je clic sur une image pour l'agrandir, une fois l'image agrandie elle devient plus grosse qu'elle doit l'être ( elle doit être en 552x315 alors qu'elle s’agrandit jusqu'à 696x397.
• ensuite mon image est décalé ; d'environ 50px par rapport au haut du cadre ou de la "box"
  et d'une quinzaine de pixels par rapport à la gauche du cadre ou de la "box".

Merci d'avance pour vos réponse ; )

Changement de la RegExp

Je propose le changement de la RegExp car elle pose des problèmes dès que les images on des classes differentes qui suivent la classe 'zgallery'.
donc on passe de :
var galleryRegExp = /zgallery(.)/;
à :
var galleryRegExp = /zgallery(.[0-9])/;

Passage a webp et problèmes d'affichage

Bonjour, j'ai passé mes images au format webp et depuis, j'ai de gros soucis d'affichage. quelqu'un d'autre a-t-il testé ? une mise a jour est-elle prévue ?

Taille automatique zoombox avec contenu html+php

Salut,

Voila j'ai installé zoombox sur mon projet de site web, ça marche super bien, j'ouvre un formulaire dans ma zoombox, il envoie bien les requêtes et tout ça.

Le formulaire envoyé est un formulaire d'inscription, j'ai modifié la taille de la zoombox pour correspondre exactement a la taille du cadre du formulaire (pour faire une petite zoombox)

Quand le formulaire d'inscription est rempli et validé je souhaiterai afficher un texte du genre "Merci d'avoir créé un compte, cliqué sur ce lien pour personnaliser votre compte ou ici pour quitter"

Le seul truc c'est que je voudrais que ce texte s'affiche dans la meme zoombox mais plus grande que celle du formulaire, comment faire ca ? Faut il fermer la première zoombox et ouvrir une deuxième avec la bonne taille ? ou alors est il possible de voir la fenêtre de la zoombox s'agrandir comme quand on passe d'une photo plus petite à une plus grande ?

Merci d'avance !!

Problème IE

Dans la fonction resize()
Il y a une virgule de fin et IE aime pas ca: 'expected identifier, string or number'

Lancement plusieurs fois la même vidéo

Bonjour,

Après avoir suivi le tuto sur le site, j'ai rencontré un soucis. La box apparait pas de problème, le problème vient du fait qu'elle lance plusieurs fois la même vidéos dans celle-ci. Du coup je me trouve avec 3 fenêtre les unes à la suite des autres dans ma box sans comprendre d'ou peut venir cette erreur.

Merci d'avance pour ton aide,

Problème de fonctionnement

Bonjour,

de mon côté zoombox ne marche pas, j'ai pourtant bien suivi la vidéo.
Voici mon code :
http://www.casimages.com/img.php?i=11042107515739200.png

Merci

vidéo invisible

Bonsoir,

J'ai un petit problème. Sur ma page, la vidéo est bien présente, mais invisible. On peut cliquer dessus, mais si on ne sait pas qu'elle est la, bah on ne la voit pas.

voici le code html de la vidéo:
< a class="zoombox" href="Wildlife.wmv" >< video src="Wildlife.wmv" alt="Démo vidéo" title="vidéo" / >< /a>< br />

Merci,
Julian-P.

PS: les espaces a coté des "crochets (> et <)" ne sont pas dans mon code, je suis oblig" de les mettre ici pour l'afficher.

Problème IE9

Bonjour,

Tout d'abord félicitations pour cette zoombox... simple d'utilisation, avec plein d'utilisations possibles, c'est génial !
Du coup, je la mets partout dans mes pages web dès que j'ai besoin d'une lightbox, mais aujourd'hui j'ai un souci avec IE...

Je suis sous IE9. J'ai des images toutes simples dans ma page qui doivent s'agrandir dans la zoombox dès que je clique dessus. Ca fonctionne super bien sous Chrome et FFX, mais pas moyen que la zoombox s'ouvre sous IE. J'ai un semblant de roulette de chargement qui s'affiche et après plus rien. Est-ce que ce problème est déjà connu et/ou est-ce que vous avez une idée d'où cela peut provenir ?

Merci d'avance pour le coup de main.
Nathalie D.