Gibt es ein Jquery-tab-control mit mehreren Zeilen von tabs?
Ich habe eine web-Anwendung mit einer dynamischen Anzahl von Registerkarten, die im Bereich zwischen 2 bis 20.
Ich bin derzeit mit Jquery UI tab plugin, aber finden, dass es das Verhalten ist weniger dann Ideal (also um 12 Tabletten, wenn es Packungen, die zweite Zeile der tabs bewegen Sie mit der tab-Auswahl und manchmal springen Sie auf 3 Zeilen statt zwei.
Dies ist ein zwei-Fach-Frage, zuerst aus hat jemand eine Idee, wie ich aufhören konnte die zweite Reihe der Registerkarten springen, um, wenn sich die Auswahl ändert.
Alternativ kennt jemand ein tab-plugin für jQuery, mit der mehrere Zeilen von Registerkarten (wenn ich kann nicht finden, eine Auflösung, die ich am Ende vielleicht mit ExtJS oder etwas ähnliches, war aber zu versuchen, halten diese Anwendung ziemlich leicht-Gewicht).
Antwort
Nach weiteren Untersuchungen es stellt sich heraus, diese wurde verursacht durch die Jquery-UI-theme, das ich verwendet wurde, war dies die problematische Stil:
.ui-tabs .ui-tabs-nav li.ui-tabs-selected { padding-bottom: .1em; border-bottom: 0; }
Ich gerade entfernt die padding-bottom: .1em und es das Problem behoben (der Schlüssel war, dass die zweite Reihe von Elementen, die bewegt wurden, zusammen mit dem Auswahl-ändern).
InformationsquelleAutor Bittercoder | 2009-03-08
Du musst angemeldet sein, um einen Kommentar abzugeben.
Sie nicht wirklich brauchen, eine Erweiterung auf alle. Verwenden Sie einfach floating-LI ist mit einem unstyled UL. Der LI sollte der wrap richtig. In der Regel eine gute Idee, um sicherzustellen Worte in der gleichen Registerkarte wickeln nicht durch das ersetzen "" mit " ".
Meine benutzerdefinierte Registerkarten-Steuerelement ist dynamisch erstellt mit ASP.Net aber die Tab-Taste und ein - /ausblenden " - Funktionalität ist, alle jQuery.
Grundlegende CSS -
InformationsquelleAutor hunter
Nicht eine technische Lösung, aber Bedenken Sie, dass Nielsen empfiehlt dringend, die gegen mehrere Zeilen von Registerkarten:
-- Tabs, Verwendet Rechts: Die 13-Usability-Richtlinien
InformationsquelleAutor Mauricio Scheffer
Dieses problem ist beschrieben in einem bug-report auf der jQuery UI-issue-tracker. Auf das bug-report, ich legte einen patch der dieses problem löst, während die Erhaltung.ui-tabs-nav-Grenze unten nicht ausgewählten Registerkarten. Cheers.
InformationsquelleAutor sunaku
Ich nicht die Art, wie tabs gerendert, wenn man eine zweite Zeile, also schrieb ich ein plugin für die Einführung eines "mehr sehen" - Registerkarte, anstatt zu brechen, um eine zweite Linie.
https://github.com/jasonday/plusTabs
InformationsquelleAutor Jason
Fand ich, dass die folgende war nützlich für sortierbare tabs auf mehreren Zeilen. Eines der Probleme, die ich hatte, war, dass tabs nicht einrastet ordnungsgemäß, wenn
axis: 'x'
angegeben wurde, aber das sah scheußlich aus, wenn das ziehen zwischen den Zeilen.Habe ich es geschafft, das zu verbessern mit den folgenden:
InformationsquelleAutor Lea Hayes
Gibt es eine Menge toller Antworten, die kann verwendet werden, um vollständig lösen das problem aber hier ist meine eigene ¢2.
Stark vereinfacht Angelegenheiten, können Sie einfach fügen Sie eine
<hr>
Stil, wie Sie möchten, trennen Sie die Zeilen von Registerkarten. Meiner Meinung nach sieht auch schöner aus als mit offenen Zeilen.InformationsquelleAutor WhyEnBe