jquery accordion réduits par défaut au chargement de la page
Je suis à l'aide de JQuery UI accordion dans ma page. J'ai code Javascript suivant sur ma page de chargement:
$(function() {
$("#accordion").accordion({
active: false,
autoHeight: false,
navigation: true,
collapsible: true
});
});
Lorsque le chargement de la page tous les onglets sont ouverts pendant quelques secondes, puis s'affaisse. Peut-être, son effet de charge. Comment puis-je faire de Jquery UI accordion s'est effondré au chargement de la page. S'il vous plaît suggérer
- Pourriez-vous reproduire ce sur jsfiddle.net?
- Veuillez vérifier le lien. jsfiddle.net/47aSC désolé, je l'ai utilisé pour la première fois et ce n'est pas formatée. Je suppose que jquery liens doivent être de vivre le site.
- Possible dup de stackoverflow.com/questions/4633971/...
- Je suis déjà à l'aide d'active faux
- Double Possible de l'Effondrement de toutes les sections en accordéon sur la page de chargement de jQuery dans le Accordéon
Vous devez vous connecter pour publier un commentaire.
Bien que n'étant pas une réponse directe, vous pouvez peut-être rendre cachés, puis de la présenter lors de sa création:
Mise à jour: Ce violon qui fonctionne pour moi: http://jsfiddle.net/47aSC/6/
{active: false, collapsible: true}
devrait rendre tout s'est effondré. Je me demande si quelque chose interfère. Pouvez-vous créer un jsfiddle avec votre problème?Pour moi cela fonctionne:
C'est probablement le chargement de quelque chose près de la fin de la page, lentement. Si vous ne pouvez pas corriger cela, vous pouvez essayer de déclarer l'élément ayant
display:none
appliqué en css, puis:Il pourrait y avoir une manière plus propre de le faire (comme @Mrchief l'indique), mais je ne pense pas que
.accordion()
formats éléments cachés bien. Vous aurez à tester.La meilleure solution est:
ouvrir jquery.ui.accordion.js et modifier les lignes 29 et 31 (par la façon dont je suis l'aide de 1.10.4).
Modifier la ligne 29 de Active: 100,
Modifier la ligne 31 de pliable: true,
De cette façon, vous n'avez pas besoin d'écrire un script ou une fonction dans l'en-tête de la page. Par la mise en Active à un nombre élevé (par exemple 100) vous dites que le 100e tag h3 est actif (ce qui en gros n'existe pas).
La pliable: true indique que tous ouvrir les balises h3 est pliable.
Il résout complètement le problème.
Cela va régler tous les
.collapse
classes dans les DOM pour fermer, mais seulement une fois le DOM a fini de charger.//On peut aussi utiliser le code ci-dessous à l'effondrement de l'accordéon sur le chargement de la page et il devrait utiliser lorsque nous sommes en utilisant bootstrap 2.0
Autres sages nous devrions utiliser le code ci-dessous pour bootstrap 3.0