Forum : Malgré les explications fournies Zoombox ne fonctionne pas...

Bonjour, et tout d'abord merci pour l'ensemble des tutoriels et ressources que vous mettez à notre disposition.
Je me suis récemment intéressé à Zoombox pour mon propre site mais malgré les indications que vous fournissez, cela ne fonctionne pas...
Je ne sais pas exactement de quelles indications vous auriez besoin pour m'aider, si possible, à résoudre ce problème, donc je vais essayer d'en donner un maximum :
Site : http://master.poke.free.fr/ mais les tests avec Zoombox sont réalisés sur http://master.poke.free.fr/uc/index.php
Utilisation de Zoombox : Pour le moment, j'essaye simplement de l'utiliser pour l'ouverture de liens ; comme une genre de pop-up. Pour être plus précis, sur le lien donné précédemment, il y a trois catégories : News Site & Forum ; Animation ; Actu Pkmn. En cliquant sur ces catégories apparaissent les dernières news correspondantes ; à la fin desquelles se trouve un lien pour voir/poster des commentaires.
Actuellement, l'ouverture de la page commentaire se fait comme suit:

<?php $id = $donnees'id']; ?>
<a href="commentaires.php?id=<?php echo $id ;?>" target=_blank onclick="window.open(this.href, 'Commentaires', 'height=200, width=500, top=50, left=50, toolbar=no, menubar=no, location=no, resizable=no, scrollbars=yes, status=no'); return false;">Commentaires</a>

(la variable id déterminant l'id de la news en question ; pour afficher les commentaires qui lui correspondent). La page ainsi ouverte de taille 500*200 affiche donc une img background de même taille et les commentaires + formulaires

Ce que je souhaiterai : que la page s'ouvre en 'pop-up' Zoombox de taille 500*200 et affiche donc le même contenu...

Pour cela : J'ai dl le pack Zoombox, l'ai extrait. Voici maintenant la structure du site :
root/uc (zone dans laquelle je fais mes tests)
--d efault/ (dossier du theme Zoombox)

-- includes/
----haut.php (correspond au header)
----menu.php
----switcher1.php (mon site propose plusieurs themes, cette page contient les fonctions pour gérer les cookies et le css à afficher)
----form_design.php (idem, gère les différents designs)
----bas.php (bas de page)

-- js/ (dossier pour le jquery ascenseur)
----jquery.js
----ascenseurclick.js

-- lightbox / (dossier du theme zoombox)

-- logo/ (contient différents logos pour les partenaires et autres img)

-- stats/ (contient différents fichiers pour les stats de visiteurs

-- style/ (contient les différents dossiers de chaque designs)
----fly/
------screen.css
------Bilder/ (contient les imgs associés à ce theme)
----leaves/
------screen.css
------Bilder/ (contient les imgs associés à ce theme)
----happy/
------screen.css
------Bilder/ (contient les imgs associés à ce theme)
----smile/
------screen.css
------Bilder/ (contient les imgs associés à ce theme)

--index.php
--backcomment.jpg (img acutelle du fond de page des commentaires)
--commentaires.php
--jquery.js (fait parti du pack dl de Zoombox)
--zoombox.css (idem)
--FLVplayer.swf
--zoombox.js

Comme vous pouvez le constater, la structure du site est un peu particulière, mais malgré avoir tenté les adaptations necessaires pour correspondre aux liens relatifs, ça ne marche tj pas.

/!\ Sur le site (lien plus haut) ; le seul lien de commentaires contenant le 'rel=zoombox' est celui de la partie 'animation' (vous pouvez donc vous servir du lien commentaire de la partie news site & forum pour voir le résultat qui était auparavant utilisé)

Voici donc comment se décompose le 'header' de la page index :

<?php $titre='MP - Index' ?>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/ascenseurclick.js"></script>
<?php include("includes/haut.php"); ?>

Voici l'include 'haut' :

<?php include("includes/switcher1.php"); ?> <!-- Défini la variable concernant le style à afficher-->
<html>
<head>  
<?php echo '<title>'.$titre.'</title>' ?> <!-- Variable définie précédemment, sur la page index-->
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="author" content="Kioshi" />
<meta name="keywords" content="master, poke, master poke, master.poke, free, site, forum, rpg, pokemon, reira, itah, april, jasper, liam, dahlan, kioshi, aya, ryu, iris, sakae" />
<?php
/* affichage de la feuille de style favorite */
echo '<link rel="stylesheet" type="text/css" href="style/'.$favorite_style.'/screen.css" media="screen" title="'.$styles$favorite_style].'" />'."\n";

/* affichage des feuilles de style alternatives */
foreach($styles as $key => $value) {
        if($key == $favorite_style) {
                echo '<link rel="alternate stylesheet" type="text/css" href="style/'.$key.'/screen.css" media="screen" title="'.$value.'" />'."\n";
        }
}
?>
<link href="zoombox.css" rel="stylesheet" type="text/css" media="screen" />
<script type="text/javascript" src="/zoombox/jquery.js"></script> 
<script type="text/javascript" src="/zoombox/zoombox.js"></script>
</head>
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<!-- Ne pas changer ci-dessous-->
<?php include("includes/form_design.php"); ?> <!-- Concerne le formulaire de changement de design-->
<?php include("includes/haut_de_page.php"); ?> <!-- Contient les divs de la bannière, les positionnements, ... -->
<div id="headerblock"></div>
<div id="positioncorps">
<!--Ne pas changer ci-dessus-->

Une fois cet include intégré à la page index, voici la suite de index.php contenant le corps :

<h1>Master Pokemon</h1>
<p>Bienvenue sur le site_v3 de Master Pokemon, un <a href="http://master-poke.xooit.com/index.php" target=_blank>forum rpg</a> sans précédent basé sur l'univers des Pokemons !
(... Je vous évite de lire toutes les blablateries inutiles xD )
    <h1 class="ascenseurclick" style="cursor:pointer;">News Site & Forum (voir)</h1>
<div> La news en elle-même, intégrée par la base de données... Puis :
           <?php $id = $donnees'id']; ?>
<a href="commentaires.php?id=<?php echo $id ;?>" target=_blank onclick="window.open(this.href, 'Commentaires', 'height=200, width=500, top=50, left=50, toolbar=no, menubar=no, location=no, resizable=no, scrollbars=yes, status=no'); return false;">Commentaires</a>
</div>
    <h1 class="ascenseurclick" style="cursor:pointer;">Animation (voir)</h1>
<div> La news en elle-même, suivie par :
<a href="commentaires.php?id=<?php echo $id2 ;?>" rel="zoombox 500 200">Commentaires</a>
</div>
. . .

/!\ A savoir /!\ Pour que le css corresponde, j'ai ajouté les #zoombox_aplat , ... à la feuille de style 'smile' uniquement. Si vous souhaitez aller sur le site pour tester ; vérifier que vous êtes sur le design 'smile' (si ce n'est pas le cas, il y a un formulaire en haut à droite qui permet de changer de design)

Afin que les chemins relatifs correspondent, voici un exemple des changements faits :

#zoombox_loader {
    background:url(../../default/loader.png) left top no-repeat;
    position:absolute;
    height: 40px;
    width: 40px;
    cursor: pointer;
    top:50%;
    left:50%;
    margin:-20px 0 0 -20px;
    overflow: hidden;
    z-index: 110;
}

(Puisque je rappelle que la feuille de style est, par rapport à /uc/ (qui contient l'index et les dossiers de zoombox) : uc/style/smile/screen.css)

Voila, il me semble avoir tout dit. Si un point est confus ou manquant, n'hésitez pas à me le dire.
Merci d'avance ;
Kioshi (kioshi.tasuki@hotmail.fr)

Malgré les explications fournies Zoombox ne fonctionne pas...

2 réponses