Internet Explorer et zoombox 2.0 - Version 1.3 ????

Phanux · mars 2013

Bonsoir à tous !
Cela faisait un petit moment que je n'étais pas venu faire un tour dans le coin

Mais bref, pour filer un coup de main à une asso que j'aime bien, j'ai voulu les aider à faire leur site. J'ai activé le plugin ZoomBox comme expliqué ici, chose que j'avais lu quelque part sur le forum, mais je ne me rappelle plus où !

Tout marche très bien, du moment où l'on suit la procédure, sauf sur IE !!! J'ai testé sous Linux avec Firefox, Opéra, Konqueror, Galléon ... (et autres), sous windows avec Firefox, Opéra et IE : et il n'y a que sous IE que cela ne fonctionne pas !!!

Je m'explique : (n'ayant pas d'image, je vais faire un discours le plus court possible !) : j'ai crée un article avec des photos : ici (site en test).
Les images s'affichent bien quel que soit le navigateur lorsque l'on clique dessus, sauf avec IE ??? La première fois l'image s'affiche, mais si l'on choisi "close" ou que l'on clique à côté de l'image pour fermer l'affichage, on ne peut plus afficher aucune image avec zoombox, même pas celle que l'on vient de fermer !!! Il faut "rafraichir" (actualiser) la page pour que l'affichage zoombox "fonctionne" encore, mais toujours une seule fois ???

Et là, j'avoue que je sèche ???

Je ne suis pas très doué (voir pas du tout ) en php ou css, mais en bidouillant, en général, j'arrive à trouver ! sauf sur ce problème !

Si quelqu'un à une petite idée, elle serait la bienvenue

Jerry Wham · mars 2013

Quelle version d'IE ?

Phanux · mars 2013

Bonjour Jerry,

Je ne dirai pas toute, mais la 7, 8 et 9, en 32 et 64 bits, sous vista comme sous seven !!! (pas pu tester les autres)

Je pense plus à un problème java (car en css difficile de reproduire cela !), mais c'est un domaine dans lequel je n'y connais absolument rien

J'ai testé aussi de désactiver d'autre plugin en cas d'incompatibilité, mais sans résultat. J'ai aussi tenté avec d'autres version de zoombox : idem, plxzoombox : ne marche pas (je ne sais pas pourquoi ???), alors que artgallerie fonctionne très bien, quelque soit le navigateur !

Etrange étrange non ???

edit : en cherchant sur google, je suis tombé sur ceci :

Une petite info, suite à un bug observé récemment sur Zoombox (qui ne fonctionnait carrément plus...) : pour une raison obscure, ce sont les lignes 87 à 90, relative à IE6, qui semblaient poser problème.
Les lignes à supprimer :

// No zoombox for IE6
if($.browser.msie && $.browser.version < 7 && !window.XMLHttpRequest){
return false;
}

J'ai testé, mais sans résultat

La première image s'agrandie bien, mais par la suite plus aucune (la 1ère n'est même plus reconnu comme étant un lien !!!)

Jerry Wham · mars 2013

Tu peux nous donner un lien vers ton site ?

Francis · mars 2013

J'ai vu le défaut (essai sur IE9) : le premier zoom se passe bien, ensuite plus aucun zoom ne marche.
J'utilise le plugin Zoombox sur un autre site (qui tourne avec PluXml 5.1.6) et je l'ai testé : ça marche sans problème.

En regardant ton code, je vois des choses bizarres :

- deux appels de jQuery 1.51. en haut, et un appel de jQuery 1.7.1 en bas de page

- le plugin Zoombox est bien appelé en bas de page et son zoombox.css dans l'en-tête, mais il y a deux lignes qu'il faudrait supprimer dans l'en-tête, je pense qu'il s'agissait d'une première mise en place de la zoombox avant l'utilisation du plugin :

<script type="text/javascript" src="/zoombox/zoombox.js"></script>
<link href="/zoombox/zoombox.css" rel="stylesheet" type="text/css" media="screen" />

Ça ira peut-être mieux, après avoir fait un peu de ménage dans le code.

Phanux · mars 2013

Jerry Wham a écrit:

Tu peux nous donner un lien vers ton site ?

La page en defaut est ici (site de test) : http://phanux.free.fr/Patriotes-Agenais/index.php?article61/departement

Ne trouvant pas, j'ai désactivé zoombox pour tester autre chose, mais je le réactive de suite, et vais supprimer les lignes en défaut !

Edit : Si je supprime les lignes d'appel de zoombox et jquery, plus rien ne fonctionne !

Voici mon header :

[== Indéfini ==]
<?php if(!defined('PLX_ROOT')) exit; ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
	<title><?php $plxShow->pageTitle(); ?></title>
	<meta http-equiv="Content-Type" content="text/html; charset=<?php $plxShow->charset(); ?>" />
	<link rel="shortcut icon" href="<?php $plxShow->template(); ?>/img/favicon.ico" />
	<link rel="stylesheet" type="text/css" href="<?php $plxShow->template(); ?>/style.css" media="screen" />
   <!--[if IE]>
   <link rel="stylesheet" type="text/css" href="<?php $plxShow->template(); ?>/ie.css" media="screen" />
   <![endif]-->

	<?php $plxShow->templateCss() ?>
	<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
    <script type="text/javascript" src="/zoombox/zoombox.js"></script>
	<link href="/zoombox/zoombox.css" rel="stylesheet" type="text/css" media="screen" />
	<link rel="alternate" type="application/atom+xml" title="Atom articles" href="<?php $plxShow->urlRewrite('feed.php?atom') ?>" />
	<link rel="alternate" type="application/rss+xml" title="Rss articles" href="<?php $plxShow->urlRewrite('feed.php?rss') ?>" />
	<link rel="alternate" type="application/atom+xml" title="Atom commentaires" href="<?php $plxShow->urlRewrite('feed.php?atom/commentaires') ?>" />
	<link rel="alternate" type="application/rss+xml" title="Rss commentaires" href="<?php $plxShow->urlRewrite('feed.php?rss/commentaires') ?>" />
</head>
<body>

J'ai le plugin jquery d'activé en 1er (dans la liste des plugins), puis zoombox après !

Peut-être, mais je vais dire une bétise, n'ai-je pas le "bon" plugin jquery, ou est-il mal appellé dans mon header ???

Phanux · mars 2013

Dans le doute, j'ai supprimé jquery pour le remettre (celui-ci : http://wiki.pluxml.org/index.php?page=Plugins+officiels#Plugins_officiels

J'ai aussi supprimé dans mon header :

[== Indéfini ==]
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>

pour le remplacer par :

[== Indéfini ==]
<script type="text/javascript" src="./plugins/jquery/jquery.min.js"></script>

Résultat : rien de changé, fonctionne toujours très bien avec firefox et opera mais pas sous IE9

Phanux · mars 2013

Après de multiples recherches sur zoombox un peu partout, il semble qu'il ne soit pas compatible avec IE ???

Je laisse donc les choses dans l'état pour l'instant, et suis bon pour trouver une autre solution pour l'affichage de cette page

Si je trouve quelque chose, je remonterai bien sur l'info.

Stéphane · mars 2013

IE n'a pas fini de nous donner du fil à retordre...

Jerry Wham · mars 2013

A mon avis, tu n'as pas la bonne version de jquery. Dans ton header, c'est la version 1.7.1 alors que dans le plugin zoombox c'est la version 1.8.1

Essaie de faire un appel vers la version du plugin zoombox plutôt que d'appeler celle du plugin jquery en plaçant le code suivant

<script  type="text/javascript" src="./plugins/zoombox/jquery.min.js"></script>

après la ligne

<!--[if IE]>
   <link rel="stylesheet" type="text/css" href="http://phanux.free.fr/Patriotes-Agenais/themes/defaut-2/ie.css" media="screen" />
   <![endif]-->

du fichier themes/defaut-2/header.php.

Désactive le plugin jquery également.

Et dis nous si ça va mieux.

Phanux · mars 2013

Pas mieux !

Si je désactive jquery, zoombox ne marche plus ! Cela a au moins le mérite de mettre IE, Firefox et Opéra d'accord sur un point

Avec jquery activé, que ce soit ta ligne ou celle que j'avais avant cela ne fait aucune différence : ça marche pour tous sauf IE ! (IE9 pour être précis).

Jerry Wham · mars 2013

Phanux a écrit:

Pas mieux !

Si je désactive jquery, zoombox ne marche plus ! Cela a au moins le mérite de mettre IE, Firefox et Opéra d'accord sur un point

Avec jquery activé, que ce soit ta ligne ou celle que j'avais avant cela ne fait aucune différence : ça marche pour tous sauf IE ! (IE9 pour être précis).

Je t'ai dit de désactiver le plugin zoombox que si tu places la ligne appelant la version de zoombox. Je ne dispose pas de IE chez moi. Je regarderai lundi.

Bonne soirée.

Phanux · mars 2013

Oups !

Je plaisante, j'avais bien compris :P
Mais si ça peut te rassurer, j'ai testé dans tous les sens possibles et inimaginables, avec ou sans les autres plugins au cas ou il y aurait une incompatibilité : sans résultat hélas !

J'ai pour l'heure opté pour une "solution" simple : plus d'images !!! J'ai mis à la place des fichiers pdf. Mais je ne pourrai pas tester avant lundi, je suis moi aussi pour ce week-end sans IE (enfin si, je peux être sous IE9, mais c'est une "version test" de windows 7, donc pas très fiable pour les test).

Edit : Dans la série toujours aussi bizarre : comme dit précédemment, j'ai remplacé les images par des fichiers pdf. Et là, oh surprise : que ce soit Firefox, Opéra ou IE9 (ma version "bêta" de seven) : zoombox m'ouvre les liens .pdf ???? je peux ouvrir ainsi un lien, le fermer, en ouvrir un autre, enfin bref : normal quoi (sur IE9 32bits seulement, car problème sur IE9 64bits, mais c'est dû au module adobe !!!) !.
Mais le problème reste le même pour les images (j'en ai mis sur l'article "National", et toujours pareil.).

Donc zoombox + IE n'aime pas juste les images .jpg ???

Phanux · mars 2013

Euréka ! ça marche.

Enfin pas vraiment, mais j'ai réussi à contourner le problème :

1. J'ai supprimé le plugin zoombox
2. J'utile comme plugin plxeditor de Jerry (plxeditor with table, qui rajoute automatiquement la class zoombox aux miniatures insérées dans les articles) et pour la galerie photo le plugin artGalerie (artGalerie), qui a un thème Zoombox.

Ne trouvant pas de solution à mon problème (ni zoombox ni plxzoombox ne voulant marcher), j'ai tenté d'utiliser les fonctions d'artGalerie pour avoir l'effet de zoom sur mes miniatures, et ça marche !!!!

Voici comment :
Il faut les deux plugins précédement cité d'installé et fonctionnel. Dans la partie config d'artGalerie, choisir le thème Zoombox (c'est le seul avec qui on peux aussi afficher les fichiers pdf).

Et c'est tout

Toutes les miniatures ajoutées par plxeditor auront l'effet zoom simple.

Pour ceux qui n'ont pas plxeditor de Jerry, il suffit d'ajouter la class zoombox aux miniatures.

<a class="zoombox" href="/data/images/blablabla.jpg">

Si l'on veut avoir l'effet zoombox comme dans la galerie (affichage des flèches "image suivante/précédente" sur l'image et le bandeau affichant les miniatures en bas), il suffit de remplacer class="zoombox" par class="zoombox zgallery0000" (les flèches ne s'affichent que pour les images, pas pour les fichiers pdf. Pas testé avec vidéos).

Un grand merci à rockyhorror et Jerry pour leurs superbes travails qui me sort une belle épine du pied

edit : on peut modifier les options de zoombox en éditant simplement dans le fichier zoombox.js ("/plugins/artGalerie/theme/Zoombox/zoombox.js) les lignes 7 à 15 (options). Pour un affichage correct des fichiers pdf, il faut augmenter les valeurs de "width" et "height", que j'ai mis respectivement à 1000 et 600 (sinon la fenêtre est trop petite).

re-edit : fonctionne avec firefox, opera, IE9 (vista)

Jerry Wham · mars 2013

Donc ce n'est pas zoombox qui est en cause mais ta "config".

Pour avoir un effet de galerie avec zoombox, il faut en effet ajouter une classe zgallery suivie d'un même numéro pour toutes les images de la gallerie.

Par exemple, si on veut deux galleries, on mettre la classe zgallerie1 dans la première série d'images et la classe zgallerie2 dans la deuxième.

Par contre, je ne te conseille pas de modifier le fichier source de zoombox.
Pour modifier la taille de la pop-up, il suffit d'ajouter une classe "w1000" et une classe "h600" dans les liens pour afficher tes pdf. Cela permettra de ne modifier la taille que lorsque c'est nécessaire.

<a href="pdfLink" class="zoombox w500 h400"/>Mon pdf</a>

Pour le reste, il vaut mieux modifier les options en pied de page :

<script type="text/javascript">
            $('a.zoombox').zoombox({
                theme       : 'zoombox',        //available themes : zoombox,lightbox, prettyphoto, darkprettyphoto, simple
                opacity     : 0.8,              // Black overlay opacity
                duration    : 800,              // Animation duration
                animation   : true,             // Do we have to animate the box ?
                width       : 600,              // Default width
                height      : 400,              // Default height
                gallery     : true,             // Allow gallery thumb view
                autoplay : false                // Autoplay for video
            });
        });
        </script>

Pour plus d'info, voir le site de Jonathan BOYER, le concepteur de zoombox.

Internet Explorer et zoombox 2.0 - Version 1.3 ????

Réponses