Jquery Tabs et bxGallery [RESOLU] |
Bienvenue invité ( Connexion | Inscription )
Jquery Tabs et bxGallery [RESOLU] |
12 Jul 2014, 13:29
Message
#1
|
|
Ceinture jaune+ OSC Groupe : Membres Messages : 124 Inscrit : 7-November 07 Lieu : Lyon Membre no 19668 |
Bonjour tout le monde,
J'ai un problème de design avec les vignettes de bxGallery lorsqu'elles sont liées à jquery Tabs. Vu que ce n'est pas facile à expliquer, voici le problème de visu : pour la première fiche descriptive (ferme de villauret), pas de problème, les vignettes sont bien positionnées. Par contre, pour les autres fermes, les vignettes se superposent. J'ai essayé de modifier tous les css possibles, même dans le fichier javascript "jquery.bxGallery.1.1.min.js". Rien n'y fait... Voici le code concerné : Code <div id="tabs"> <div id="contentTop"> <?php $tab_contenu = Array(); $conteur_tab = 1; $liste_query = tep_db_query("select p.products_id, p.products_image, pd.products_name, pd.products_baseline, pd.products_description from " . TABLE_PRODUCTS . " p, " . TABLE_PRODUCTS_DESCRIPTION . " pd, " . TABLE_PRODUCTS_TO_CATEGORIES . " p2c where etot.categories_id = '6' and p2c.products_id = p.products_id and p.products_id = pd.products_id and pd.language_id = '" . (int)$languages_id . "'"); ?> <ul> <?php while ($liste = tep_db_fetch_array($liste_query)) { ?> <li> <a href="#tabs-<?php echo $conteur_tab; ?>">| <?php echo $liste['products_name']; ?> |</a> </li> <?php $tab_contenu[] = array( 'num_tab' => $conteur_tab, 'products_id' => $liste['products_id'], 'products_name' => $liste['products_name'], 'products_baseline' => $liste['products_baseline'], 'products_description' => $liste['products_description'], 'products_image' => $liste['products_image'], ); $conteur_tab++; } ?> </ul> </div><!--fin contentTop--> <?php reset($tab_contenu); foreach( $tab_contenu as $value ) { $pi_query = tep_db_query("select image, htmlcontent from " . TABLE_PRODUCTS_IMAGES . " where products_id = '" . $value['products_id'] . "' order by sort_order"); ?> <div id="tabs-<?php echo $value['num_tab']; ?>"> <div id="contentMiddle"> <div id="contentMiddleLeft" class="pinLeft"> <div id="texte" class="contentText"> <h1><?php echo $value['products_name']; ?></h1> <?php if (tep_not_null($value['products_baseline'])) { echo '<p id="baseline">' . $value['products_baseline'] . '</p>'; } ?> <?php echo $value['products_description']; ?> </div> </div> <div id="contentMiddleRight" class="pinRight"> <div id="piGal-<?php echo $value['products_id']; ?>" class="piGal"> <ul> <?php $pi_counter = 0; while ($pi = tep_db_fetch_array($pi_query)) { $pi_counter++; $pi_entry = '<li style="float:left;"><a href="'; $pi_entry .= tep_href_link(DIR_WS_IMAGES . $pi['image'], '', 'NONSSL', false); $pi_entry .= '" target="_blank" style="background:none;" rel="fancybox">' . tep_image(DIR_WS_IMAGES . $pi['image']) . '</a>'; $pi_entry .= '</li>'; echo $pi_entry; } ?> </ul> </div> </div> <script type="text/javascript"> $('#piGal-<?php echo $value['products_id']; ?> ul').bxGallery({ maxwidth: 300, maxheight: 300, thumbwidth: <?php echo (($pi_counter > 1) ? '97' : '0'); ?>, thumbcontainer: 400, load_image: 'ext/jquery/bxGallery/spinner.gif' }); </script> <script type="text/javascript"> $("#piGal-<?php echo $value['products_id']; ?> a[rel^='fancybox']").fancybox({ cyclic: true }); </script> </div><!--fin contentMiddle--> </div><!--end id tabs-x --> <?php } ?> </div><!--end id tabs--> Un p'tit coup d'pouce ? Merci beaucoup !! Ce message a été modifié par equisol - 20 Jul 2014, 10:19. -------------------- Goo69
|
|
20 Jul 2014, 10:19
Message
#2
|
|
Ceinture jaune+ OSC Groupe : Membres Messages : 124 Inscrit : 7-November 07 Lieu : Lyon Membre no 19668 |
Le problème vient du calcul de la taille de l'image dans jquery.bxGallery.1.1.min.js
Il faut remplacer : Code $img.height(($imgheight/$imgwidth)*o.thumbwidth) Par une valeur fixe de largeur de vignettes : Code $img.height('73px') C'est du bidouillage, mais ça fonctionne. -------------------- Goo69
|
|
Version bas débit | Nous sommes le : 28th March 2024 - 20:49 |
Ce site est déclaré auprès de la commision Nationale de l'Informatique et des Libertés (déclaration n°: 1043896) |