web-dev-qa-db-fra.com

Contrôle de la hauteur d'un accordéon jQuery dans la page de contenu

J'ai réussi à ajouter une page de contenu d'accordéon jQuery à mon site Drupal7 en suivant les instructions/code donnés ici: http://www.chrisherberte.com/blog/drupal-7-and-jquery-ui-accordion .

Cependant, la hauteur dans les champs déroulants n'est pas calculée correctement. Certains sont trop longs avec beaucoup d'espace blanc, d'autres sont trop courts, ce qui signifie qu'une barre de défilement est ajoutée pour afficher tout le texte. Il semble prendre toutes les hauteurs de chaque champ et les utiliser pour calculer une hauteur moyenne qu'il applique ensuite.

J'ai essayé le thème Bartik par défaut, ainsi que mon thème personnalisé, la fonctionnalité est la même sur les deux, donc pas un problème css, mais un problème avec jquery lui-même.

En plus de cela, l'utilisation d'éléments de liste HTML l'empêche de fonctionner tous ensemble, et gâche complètement la mise en forme .

screenshot

Je n'ai aucune idée où ni comment éditer Jquery pour résoudre ce problème et je ne veux certainement pas vraiment pirater le cœur.

7javascriptnavigation
5
Renaee

Vous devez d'abord essayer de définir autoHeight sur false , cela résoudra le problème de hauteur.
Vous devriez également envisager de tiliser des comportements dans Drupal.

<?php
drupal_add_library('system', 'ui.accordion');
drupal_add_js("
  (function ($) {
    Drupal.behaviors.accordionRoles = {
      attach: function (context, settings) {
        $('#accordion').accordion({
          autoHeight: false
         });
      }
    };
  }(jQuery));
", 'inline');
?>

Ensuite, j'ai pu trouver le problème concernant les listes HTML, j'ai saisi votre code HTML, je l'ai mis localement et j'ai utilisé source de démonstration pour l'accordéon jQuery UI (la section 3 contient une liste HTML à l'intérieur) et cela semble fonctionner correctement .

HTML lists working fine

3
tostinni