Comment définir une dynamique de la hauteur sur le contenu de chaque étape?
Je suis en utilisant Jquery étapes de l'assistant plugin. Le problème que j'ai, c'est que chaque étape de l'assistant de contenu d'une hauteur différente. Le css fourni avec les exemples pour contrôler la hauteur du contenu est
.wizard > .content
{
background: #eee;
display: block;
margin: 0.5em;
min-height: 35em;
overflow: hidden;
position: relative;
width: auto;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
J'ai modifié le min-hauteur de dépassement et de propriétés, mais ça ne fonctionne toujours pas faire ce que je veux accomplir. Ce que je veux, c'est la hauteur de seuls suffisamment élevés pour accueillir le contenu de chaque étape.
Par exemple, dire que j'ai 2 champs pour l'étape 1 et 10 champs pour l'étape 2. Dans les exemples, le contenu est tout de même hauteur donc ça a l'air terrible d'avoir une beaucoup plus grande hauteur que ce qui est nécessaire pour les 2 champs pour accueillir les 10 champs à l'étape 2.
Si je supprime le min-height de la propriété, pas de contenu du tout. N'Jquery étapes nécessitent une hauteur fixe de travail pour toutes les étapes? J'espère qu'il y a une façon de faire de la hauteur dynamique pour accueillir la hauteur de chaque étape.
Merci
Vous devez vous connecter pour publier un commentaire.
Supprimer la propriété height de la ci-dessous classe dans
jquery.steps.css
:Dans l' -
jquery.steps.js
de recherche pour:Devrait être autour de la ligne de 844. Directement après, ajouter:
Le problème sera sûrement résolu.
Je pense que ces réponses sont un peu daté; le fichier css a l'air très différent. Un lien posté dans certains autres commentaires semblait fonctionner pour moi.
Fondamentalement, vous trouverez ces blocs dans la validation de la css et de les faire ressembler à ceci:
Et l'intégrer avec votre javascript:
Travaillé comme un champion pour moi. Assez surpris de découvrir que ce n'est pas déjà partie de l'extension.
Si quelqu'un trouve cette après toutes ces années, le problème est toujours là.
Voici comment résoudre le problème sans la mise à jour de javascript, en utilisant uniquement css:
src: https://github.com/rstaib/jquery-steps/issues/8#issuecomment-368114763
Une seule ligne de css qui fonctionne pour moi.
Il va automatiquement ajuster la hauteur de votre pour chaque section
.assistant > .contenu > .body{ position: relative !important;}