Ist auch ganz gut so, dass Du nix anfassen darfst. Hast Du mehr vom Urlaub. :D Dann noch viel Spaß und tolles Wetter!
Druckbare Version
Moin,
Schön zu hören, das ist ja immerhin der Normalfall (Cookies und JS erlaubt).
Ich gestehe, dass ich diesen Fall nicht getestet habe, weil ich ihn für zu ungewöhnlich hielt (Cookies verboten, aber JS erlaubt). Aber wie gut, dass Du das getestet hast. Du hast damit einen Bug im Original TabControl aufgedeckt, der auftritt, sobald man mehr als eine Reitergruppe pro Seite hat. Entweder in ein und dem selben Artikel (wie es vermutlich bei Dir der Fall ist?): Öffnen eines Reiters in einer Gruppe schließt alle Reiter auch der anderen Gruppe. Oder in verschiedenen Artikeln (egal ob in einem oder verschiedenen Layoutbereichen): die Reitergruppen sind dann völlig unabhängig voneinander.
Der Bug im Original ist, dass JEDE Reitergruppe per Template ce_tabcontrol_tab.tpl einerseits den kompletten JS Code einbringt und andererseits, vor allem, die Anweisung window.addEvent('domready', loadTabControls); jedesmal einfügt. MooTools macht dann stur das, was befohlen wurde: es führt die Funktion loadTabControls() mehrfach aus (window.addEvent('domready', xxx); baut eine Queue von auszuführenden Funktionen auf).
Hat man also 2 Reitergruppen, dann wird der JS-Code 2 mal durchlaufen. In der Folge gibt es für jede Reitergruppe ZWEI TabControl Klassen (insgesamt 4 Klassen statt der 2 erforderlichen), der onChange Event feuert dann auch ZWEIMAL kurz hintereinander. Im Original fällt das nicht weiter auf, der Code macht halt zweimal kurz nacheinander (sinnloserweise) das Gleiche.
Aber in meinem Code wird beim ersten Durchlauf der Hash (korrekt) geändert auf die Id der Reitergruppe ... im unerwünschten/überflüssigen 2. Durchlauf wird dieser Hash aber nicht mehr als Id eines Panels erkannt und deshalb werden dann die Reitergruppen mit Voreinstellung geöffnet. (Mit Cookies an springen die dann ein und richten es).
Vorläufig habe ich bei mir das mehrfache Ausführen der Funktion loadTabControls() mit einem Flag verhindert und damit geht es dann auch mit Cookies aus/JS an ... aber das ist sicher nicht der Weisheit letzter Schluss. Ich suche gerade einen eleganten Weg, den Code und das Hinzufügen zu domready automatisch und zuverlässig nur EINMAL zu machen, auch bei mehreren Reitergruppen.
Außerdem arbeite ich gerade an einem weichen Rollen. Funktioniert auch schon für eine Reitergruppe bzw. mehrere Reitergruppen im selben Artikel. Hat aber noch systematische Probleme für Reitergruppen in verschiedenen Artikeln. Insbesondere, wenn diese in Y Richtung sehr weit voneinander entfernt sind.
Deshalb leider noch kein guter Code ... nur der vorläufige Patch zur Verhinderung des mehrfach Ladens:
LG, GeorgPHP-Code:
function loadTabControls() {
+ if (this.loadedTabControlsAlready) {
+ return;
+ }
+ this.loadedTabControlsAlready = true;
$$('div.mod_article').each(function(el, idx) {
var xcookieBase = el.id ? 'tabcontrol_' + el.id : 'tabcontrol_x' + idx;
Hi Georg,
hmmh, dass wir es beide unwahrscheinlich finden, JS an und Cookies aus, darüber hatten wir uns ja schonmal unterhalten. Hab´s halt trotzdem mal getestet, um zu sehen, was passiert. Stimmt, meine beiden Reitergruppen auf der getesteten Seite liegen im selben Artikel. Mein Testcase sieht so aus: In der einen sind mehrere Fotogalerien und ein Tutorial, in der anderen ganz unten über dem Footer das Kommentarmodul und Verwendungshinweise. Und in beiden Gruppen ist der rechte Reiter ohne Inhalt. Ihn schmückt eine "X"-Grafik, der dient als Ausknipsknopf. Wenn man auf diesen Reiter klickt, verschwinden alle Panes der Gruppe und nur die Kopfzeile mit den Reitern bleibt dann sichtbar.
So, eben Deinen Codeschnipsel eingefügt und wieder dasselbe probiert, JS an, Cookies aus. Tja, leider hat es nichts verändert. Der Rücksprung funktioniert nicht. Nach wie vor immer der erste Tab geöffnet und die Positionierung im Viewport erfolgt unabhängig von den Reitergruppen einfach dorthin, wo ich vorher war. Na klar, wenn beim Klicken auf einen Link die Reitergruppe im Viewport zu sehen war, ist sie es exakt genauso nach der Rückkehr (außer eben, dass immer das erste Tab geöffnet ist), doch das hat überhaupt nichts mit der Reitergruppe zu tun.
Ohne es ausprobiert zu haben, folgere ich daraus, dass es ohne Cookies UND ohne JS genausowenig funktioniert, wäre ja sonst unlogisch. Und diese Konstellation ist widerum öfter gemeinsam anzutreffen.
Zuguterletzt hab ich auch noch "ohne JS, mit Cookies" ausprobiert. Tja, da geht dann schon beim ersten Laden garnichts. Sämtliche Panes aller Reitergruppen sind nicht nur offen, sondern die Divs erscheinen auch alle untereinander statt nebeneinander. Sieht nicht wirklich schlimm aus, nur ziemlich raumgreifend. Und bei Klick auf die Reiter passiert so logischerweise auch nichts. Bei den Accordiongruppen ist es übrigens genau dasselbe, in #main genauso wie in #right. Ist das bei Dir genauso oder könnte es vielleicht ebenfalls damit zusammenhängen, dass ich mehrere im selben Artikel habe?
Vielleicht ganz interessant für den ein oder anderen.
TabControl Autoplay
http://www.contao-community.de/showt...ntrol-Autoplay
Danke für den Tipp. Hatte es gestern schon entdeckt. Aus der Beschreibung bin ich allerdings noch nicht so richtig schlau geworden, weil garnichts zu den Steuerungsoptionen erwähnt ist. Ob z. B. eine Benutzeraktion in einem der Tabs das aut. Wechseln stoppt.
@soweit_ok
Die Anzeigedauer der Tabs kann eingestellt werden.
Wenn sich der Mouse-Zeiger auf einem Reiter befindet - stoppt der Autoplay - startet dann wieder, sobald der Mouse-Zeige die Tabs verlässt.
Beispiel: http://www.wbg-premnitz.de/
Hi Christian,
danke für die Info. Ich verwende allerdings das modifizierte Templat von Georg, über dessen Funktion wir in diesem Thread diskutieren. Um Dein Autoplay zu verwenden, würde ich dementsprechend den Scriptcode mit dieser Funktion erweitern. Das Default-Verhalten von ce_tabcontrol, ob nun mit oder ohne Autoplay, nach einem Reload stets den ersten Tab zu öffnen, gefällt mir halt nicht.
Weil mit der erweiterten Funktionalität nun immer automatisch der zuletzt offene Tab geöffnet wird, würde ein Autoplay-Restart nach Verlassen des Fokus diesem Konzept zuwiderlaufen. Daher meine Frage - für eine harmonische Integration wäre das Autoplay-Feature insoweit zu ändern, dass es nach Mausklick in einem Element nicht fortsetzt, auch nicht nach Rückkehr von einem im Tab besuchten Link. Soll also nur beim initialen Laden der Seite anspringen. Auch müsste für eine Reitergruppe "Autoplay:nein" konfigurierbar sein, z. B. per Anzeigedauer=0.
@soweit_ok
Eigenschaften des CE ... siehe Anhang.
Lass uns bitte hier diskutieren http://www.contao-community.de/showt...ntrol-Autoplay
Neue Version am Start.
http://www.contao.org/erweiterungsli...030009.de.html
- Contao 2.10.x fix
- Autoplay integration
Hallo Christian,
nach einem Update von 1.1.4 auf 1.3.0 sind die TABs im Frontend alle ausgeklappt. Nach einem Downgrade auf 1.1.4 geht alles wieder. Müsste ich noch irgendwas beachten bzw. ändern, was ich in der Eile überlesen habe?
Contao 2.10.3, keine Änderungen an fe_page, Ausgabeformat XHTML Strict.
Kann ich bestätigen, funktioniert für mich leider auch nicht. Alle Inhaltselemente untereinander, keine Funktion, obwohl tabcontrol.js laut Quelltext eingebunden ist.
Tabcontrol 1.3.0, frische Contao-Installation 2.10.3.
Gruß
Michael
@Peter & Michael
Kann man das mal im Web sehen?
Habt ihr "Daten bereinigen" (Contao Systempflege) nach dem Update durchgeführt?
Dasselbe hier. Dateien bereinigt. Alle Tabs ausgeklappt.
Gruß
Cazzari
Hab zum Test die Erweiterung komplett neu auf einem 2.10.3 System installiert (also kein Update) und
dort funktioniert die Erweiterung.
Nur die Klasse .ce_tabcontrol wurde auf .ce_tabcontrol_tabs geändert.
Hallo,
ich habe an der Erweiterung mitgearbeitet.
Die Erweiterung ist für Contao 2.10 gedacht.
Auf meinerTestseite ist MooTools (1.3.2) über google und MooTools-More eingebunden.
Vieleicht fehlt dieses oder ggf. eine falsche Version?
Gruß
Mirco
Fehler gefunden.
Stellt man die Ausgabe im Seitenlayout auf HTML funktioniert es.
Sorry ... Fehler im XHTML Template ... wird morgen behoben. :rolleyes:
Habe ebenfalls seit gestern das Problem. Ich habe soeben die Erweiterung erneut geupdatet aber es hat sich noch nichts getan.
Muss ich vllt noch was am Template machen?
Achso ok, dann warte ich noch. Danke.
ich hab das ganze auf html5 zu laufen.
Tabs nun alle untereinander sichtbar. Contao 2.10.2 im Internet explorer 7
hab die screenshots vor mir, auf meinem IETester kann ich es aber nicht reproduzieren!
updates sind eingespielt und werd mal morgen abwarten, bis der kunde mit seinem echten IE7 das ganze prüft :)
PS: danke für den netten Anruf... das ist ja mal nen Support... irre :D
@ways2web ;)
Nun kann wieder aktualisiert werden ... nun sollten alle Fehler raus sein.
Sorry für die Unannehmlichkeiten.
Christian hat ein Update ins ER gestellt. Diese aktuelle Version 1.3.0 Build 20 funktioniert nun auch mit XHTML bestens. Eben getestet auf Firefox 8 und IE 6 bis 9.
Herzlichen Dank, Christian!
Gruß
Michael
Update: Christian war schneller :)
Guten morgen.
ich bin gerade am Testen von tabcontrol. Die reiter werden bei mir als Liste angezeigt. Wie bekomme ich es hin, dass es Reiter werden?
http://www.fischbacher-sv.de/contao/...es/verein.html
Gruß
Hallo gerdi,
Indem Du das Template anpasst:Zitat:
ich bin gerade am Testen von tabcontrol. Die reiter werden bei mir als Liste angezeigt. Wie bekomme ich es hin, dass es Reiter werden?
Code:<!-- indexer::stop -->
<script type="text/javascript">
<!--//--><![CDATA[//><!--
function loadTabControls() {
$$('div.mod_article').each(function(el, idx) {
var xcookieBase = el.id ? 'tabcontrol_' + el.id : 'tabcontrol_x' + idx;
var xtabs = el.getElements('<?php echo $this->tabsSelector; ?>');
var xpanes = el.getElements('<?php echo $this->panesSelector; ?>');
var xinitialTab = '';
if (Cookie.read(xcookieBase) && !isNaN(parseInt(Cookie.read(xcookieBase)))) {
var initialIndex = parseInt(Cookie.read(xcookieBase));
if (initialIndex >= 0 && initialIndex < xpanes.length && initialIndex < xtabs.length) {
// give precendence to anchor
var anchoredPane = $(location.hash.substr(1));
if (anchoredPane) {
xpanes.each(function(pane, index) {
if (anchoredPane === pane) {
initialIndex = index;
}
});
}
xinitialTab = xtabs[initialIndex];
}
}
new TabControl(el,
{
cookieBase: xcookieBase,
initialTab: xinitialTab,
behaviour: '<?php echo $this->behaviour; ?>',
tabs: xtabs,
panes: xpanes,
selectedClass: 'selected',
hoverClass: 'hover',
onChange: function(pane, tab) {
// remember open tab
Cookie.write(this.options.cookieBase, this.panes.indexOf(pane));
// kill/set hash mark (for a working back button)
// location.hash = pane.id ? '#' + pane.id : '#x';
location.hash = '';
}
});
});
}
window.addEvent('domready', loadTabControls);
//--><!]]>
</script>
<!-- indexer::continue -->
<div class="<?php echo $this->class; ?>_tabs block"<?php echo $this->cssID; ?><?php if ($this->style): ?> style="<?php echo $this->style; ?>"<?php endif; ?>>
<ul>
<?php foreach ($this->titles as $title) : ?>
<li class="<?php echo $this->tabs; ?>"><?php echo $title; ?></li>
<?php endforeach; ?>
</ul>
</div>
Und es per CSS Stylest:
:)Code:/* ---------------- Style TabControl --------------- */
.ce_tabcontrol_tabs ul li
{
float:left;
display:block;
margin-right:3px;
margin-left:3px;
padding:8px 10px 8px 6px;
text-align:center;
background-color:#e6e6e6;
font-size:12px;
color:#666699;
list-style-type:none;
-moz-border-radius:7px 7px 0 0;
-webkit-border-radius:7px 7px 0 0;
border-radius:7px 7px 0 0;
behavior: url(PIE.htc);
}
.ce_tabcontrol_tabs ul li.selected
{
padding:8px 10px 8px 6px;
font-size:12px;
color:#A84204;
}
.tabs
{
font-weight:bold;
}
.hover
{
cursor: pointer;
}
.panes
{
padding-bottom:10px;
background-color:#e6e6e6;
-moz-border-radius:7px;
-webkit-border-radius:7px;
border-radius:7px;
behavior: url(PIE.htc);
}
Viele Grüße
MiTsch
Hi Mitsch.
Ich habs jetzt nicht ausprobiert und bin auch nicht der Progger, das ich das so aus dem Code sehen würde, aber was macht denn deine Templateanpassung?
Wenn ich tabcontrol angepasst habe, habe ich das pur mit CSS gemacht...
Gruß
Thomas
vielleicht habich es auch einfach übersehen.. aber ich sah nirgens das css fürs tabcontrol
gruss
ways
Hallo,
danke für Eure Hilfe. Ich werde mich mal daran versuchen. Muss ich im Template die Änderungen auch druchführen oder reicht die CSS Erweiterung?
Gruß
Der Unterschied zwischen der ungeordneten Liste und hübschen Karteireitern ist nur CSS. Ich habe mich bei der Gestaltung meines ersten [tabcontrol]-Reitersets von jukemedia (Jutta Kemperle) inspirieren lassen:
Spielwiese zu diversen Erweiterungen (sehr interessant)
Beispielseite zu [tabcontrol]
Wie immer: HTML-Struktur und CSS verstehen und dann das CSS für den eigenen Bedarf anpassen.
Dann werde ich mal noch ein CSS Bauplan in die Erweiterung packen. ;)
Das ist eine sehr gute Idee. So eine Art Standard-CSS-Theme, sodass es schon ein bisschen wie TAB-Reiter aussieht. Das Standard-Theme können wir dann ja "Corega" nennen ;-)
Hallo,
das wäre supi. Ich tue mich auch schwer. :-)
Hallo, ich benutze die Erweiterung erst seit der Version 1.3.0 b21. Leider bekomme ich den Fehler, der einige Postings vor mir schon aufgetaucht ist trotzdem... Mir werden keine Tabs angezeigt, sondern alle Inhalte ausgeklappt.
Contao v2.10.4 / XHTML strict / tabcontrol.js ist drin / Mootools aktiviert
Link
Danke für die Hilfe.