jQuery UI Accordéon-comment supprimer complètement style?
j'adore la fonctionnalité de l'accordéon jQuery (http://jqueryui.com/demos/accordion/) cependant je ne veux pas le style !!
je voudrais me débarrasser de tous les styles, l'img, la frontière, la couleur, etc...
je ne vois pas d'option pour ça, c'est quelque chose qu'ils devraient ajouter. Ou je me suis trompe?
7 réponses
Vous pouvez faire votre propre accordéon. Utiliser l'accordéon jQuery sans L'interface utilisateur est inutile. Créer votre propre accordéon adapté à votre site est un peu facile. Vous avez juste besoin de réparer la façon dont vous voulez le construire...disons:
<div id='container'>
<a href='javascript:;'>First link</a>
<div class='content'> SOME CONTENT HERE </div>
<a href='javascript:;'>Second link</a>
<div class='content'> SOME CONTENT HERE </div>
...
</div>
Ensuite, vous avez juste besoin de faire quelque chose comme
//On click any <a> within the container
$('#container a').click(function(e) {
//Close all <div> but the <div> right after the clicked <a>
$(e.target).next('div').siblings('div').slideUp();
//Toggle open/close on the <div> after the <a>, opening it if not open.
$(e.target).next('div').slideToggle();
});
vous pouvez maintenant modifier votre classe comme vous le voulez puisque vous n'en avez pas besoin pour le JavaScript. Notez que le avec la classe "contenu" peut contenir tout ce que vous voulez, y compris, autre ou depuis le .les frères et sœurs et .prochaine s'appliquent uniquement à la même hiérarchie.
si vous n'êtes pas intéressé par le thème ui (comme moi) alors n'incluez pas les fichiers CSS du thème
j'avais besoin (voulu) de faire la même chose. Dans mon cas, je voulais supprimer le rembourrage supplémentaire que le CSS par défaut fournit pour l'accordéon-contenu, qui ressemble à ceci:
.ui-accordion .ui-accordion-content { padding: 1em 2.2em; border-top: 0; margin-top: -2px; position: relative; top: 1px; margin-bottom: 2px; overflow: auto; display: none; zoom: 1; }
MY css j'ai simplement ajouté ceci:
.ui-accordion .ui-accordion-content {padding: 0;}
ce réglage réussi (overrode) juste le rembourrage.
Rob
je suppose que vous avez déjà résolu le problème depuis que vous avez écrit en 2010. Par ailleurs, il est maintenant possible d'éviter le style de chaque widget ui par panneau de configuration, sur le site officiel de jqueryUI, avant de télécharger le thème.
http://jqueryui.com/themeroller/
en cas D'accordéon, il suffit de 'décocher' le bouton 'accordéon' et de télécharger le fichier généré.
il est assez tard pour répondre je sais mais je pense que cela pourrait être utile... juste en cas :)
vous ne le faites généralement pas via js c'est pourquoi il n'y a pas d'option. Vous outrepassez la css. Découvrez la base fichier css et de recherche pour l' .ui-accordian.. il y aura aussi des styles scoped à certains geenral .ui-widget classes que vous devez annuler. D'habitude, je le charge dans Firebug et je regarde ce qui est appliqué, alors je sais tout ce que je dois surmener pour lui donner mon apparence et ma sensation.
oubliez tous ces trucs, dérogations ou autres douleurs.
il suffit de fournir une portée css lorsque vous téléchargez votre thème, comme: .jquerythemeon
et ensuite mettre la classe à tous les éléments que vous voulez avoir pour thème
modifier: J'ai eu des bestioles avec une lunette aujourd'hui, dans la structure.min.css le champ d'application a toujours été généré avec "jquerythemeon" et non pas ".jquerythemeon". Pour le réparer, il suffit de remplacer toutes les occurences
pour supprimer le style par défaut, utilisez l'option clearStyle:
$( ".selector" ).accordion({ clearStyle: true });