[TYPO3-german] CSS-Dropdown in TS nachbauen
Guten Morgen zusammen,
ich versuche gerade ein MegaDropdown in Typo3 einzubinden (Vorlage
http://www.sohtanaka.com/web-design/examples/mega-dropdowns/
http://www.sohtanaka.com/web-design/examples/mega-dropdowns/), hänge
aber an einer Stelle und das Thema brennt mir jetzt schon seit Tagen
unter den Nägeln, ohne dass ich auf eine Lösung gekommen bin. :-/
Ehrlich gesagt, weiß ich mittler Weile gar nicht mehr, ob sich das so in
TS umsetzen lässt.
Wenn es mal fertig ist, soll es diese Struktur haben:
ul id=topnav
lia href=# class=homeHome/a/li
li
a href=# class=productsProducts/a
div class=sub
ul
lih2a href=#Desktop/a/h2/li
lia href=#Navigation Link/a/li
lia href=#Navigation Link/a/li
/ul
ul
lih2a href=#Laptop/a/h2/li
lia href=#Navigation Link/a/li
lia href=#Navigation Link/a/li
/ul
ul
lih2a href=#Accessories/a/h2/li
lia href=#Navigation Link/a/li
lia href=#Navigation Link/a/li
/ul
ul
lih2a href=#Accessories/a/h2/li
lia href=#Navigation Link/a/li
lia href=#Navigation Link/a/li
/ul
/div
/li
lia href=# class=saleSale/a/li
lia href=# class=communityCommunity/a/li
lia href=# class=storeStore Locator/a/li
/ul
Bisher bin ich so weit gekommen:
ul class=topnav
lia class=startseite onfocus=blurLink(this);
href=startseite/Startseite/a/li
li
a class=produkte onfocus=blurLink(this); href=Produkte/a
div class=sub
ul
lia class=Desktop onfocus=blurLink(this);
href=#Desktop/a/li
lia class=Spiele onfocus=blurLink(this);
href=#Spiele/a/li
lia class=Autos onfocus=blurLink(this);
href=#Autos/a/li
lia class=Desktop2 onfocus=blurLink(this);
href=#Desktop2/a/li
lia class=Spiele2 onfocus=blurLink(this);
href=#Spiele2/a/li
lia class=Autos2 onfocus=blurLink(this);
href=#Autos2/a/li
/ul
/div
/li
lia class=mehr onfocus=blurLink(this); href=mehrNoch
mehr/a/li
/ul
### Menü ###
lib.MENU = HMENU
lib.MENU {
entryLevel = 1
### Erste Ebene ###
1 = TMENU
1 {
wrap = ul class=topnav|/ul
NO {
ATagParams = class = {field:tx_realurl_pathsegment}
allStdWrap.insertData = 1
wrapItemAndSub = li|/li
stdWrap.cObject = COA
stdWrap.cObject {
20 = TEXT
20.wrap = |
20.field = subtitle
}
}
ACT .NO
ACT = 1
ACT {
ATagParams = class = {field:tx_realurl_pathsegment}
allStdWrap.insertData = 1
}
}
### Zweite Ebene ###
2 = TMENU
2 {
ATagParams = class = {field:tx_realurl_pathsegment}
allStdWrap.insertData = 1
wrap = div class=subul|/ul/div
NO {
ATagParams = class = {field:tx_realurl_pathsegment}
allStdWrap.insertData = 1
# expAll = 1
allWrap = li|/li
stdWrap.cObject = COA
stdWrap.cObject {
20 = TEXT
20.wrap = |
20.field = subtitle
}
}
}
}ul id=topnav
lia href=# class=homeHome/a/li
li
a href=# class=productsProducts/a
div class=sub
ul
lih2a href=#Desktop/a/h2/li
lia href=#Navigation Link/a/li
lia href=#Navigation Link/a/li
/ul
ul
lih2a href=#Laptop/a/h2/li
lia href=#Navigation Link/a/li
lia href=#Navigation Link/a/li
/ul
ul
lih2a href=#Accessories/a/h2/li
lia href=#Navigation Link/a/li
lia href=#Navigation Link/a/li
/ul
ul
lih2a href=#Accessories/a/h2/li
lia href=#Navigation Link/a/li
lia href=#Navigation Link/a/li
/ul
/div
/li
lia href=# class=saleSale/a/li
lia href=# class=communityCommunity/a/li
lia href=# class=storeStore Locator/a/li
/ul
Bisher bin ich so weit gekommen:
ul class=topnav
lia class=startseite onfocus=blurLink(this);
href=startseite/Startseite/a/li
li
a class=produkte onfocus=blurLink(this); href=Produkte/a
div class=sub
ul
lia class=Desktop onfocus=blurLink(this);
href=#Desktop/a/li
lia class=Spiele onfocus=blurLink(this);
href=#Spiele/a/li
lia class=Autos onfocus=blurLink(this);
href=#Autos/a/li
lia class=Desktop2 onfocus=blurLink(this);
href=#Desktop2/a/li
lia class=Spiele2 onfocus=blurLink(this);
href=#Spiele2/a/li
lia class=Autos2 onfocus=blurLink(this);
href=#Autos2/a/li
/ul
/div
/li
lia class=mehr onfocus=blurLink(this); href=mehrNoch
mehr/a/li
/ul
und das dazu gehörige TS (Setup)
### Menü ###
lib.MENU = HMENU
lib.MENU {
entryLevel = 1
### Erste Ebene ###
1 = TMENU
1 {
wrap = ul class=topnav|/ul
NO {
ATagParams = class = {field:tx_realurl_pathsegment}
allStdWrap.insertData = 1
wrapItemAndSub = li|/li
stdWrap.cObject = COA
stdWrap.cObject {
20 = TEXT
20.wrap = |
20.field = subtitle
}
}
ACT .NO
ACT = 1
ACT {
ATagParams
Re: [TYPO3-german] CSS-Dropdown in TS nachbauen
Christian Wolff schrieb:
-BEGIN PGP SIGNED MESSAGE-
Hash: SHA1
Am 04.06.2010 08:37, schrieb Torsten:
Guten Morgen zusammen,
ich versuche gerade ein MegaDropdown in Typo3 einzubinden (Vorlage
http://www.sohtanaka.com/web-design/examples/mega-dropdowns/
http://www.sohtanaka.com/web-design/examples/mega-dropdowns/), hänge
aber an einer Stelle und das Thema brennt mir jetzt schon seit Tagen
unter den Nägeln, ohne dass ich auf eine Lösung gekommen bin. :-/
Ehrlich gesagt, weiß ich mittler Weile gar nicht mehr, ob sich das so in
TS umsetzen lässt.
Wenn es mal fertig ist, soll es diese Struktur haben:
ul id=topnav
lia href=# class=homeHome/a/li
li
a href=# class=productsProducts/a
div class=sub
ul
lih2a href=#Desktop/a/h2/li
lia href=#Navigation Link/a/li
lia href=#Navigation Link/a/li
/ul
ul
lih2a href=#Laptop/a/h2/li
lia href=#Navigation Link/a/li
lia href=#Navigation Link/a/li
/ul
ul
lih2a href=#Accessories/a/h2/li
lia href=#Navigation Link/a/li
lia href=#Navigation Link/a/li
/ul
ul
lih2a href=#Accessories/a/h2/li
lia href=#Navigation Link/a/li
lia href=#Navigation Link/a/li
/ul
/div
/li
lia href=# class=saleSale/a/li
lia href=# class=communityCommunity/a/li
lia href=# class=storeStore Locator/a/li
/ul
hi Torsten ich glaube das ist in TS zu realisieren hier mein ansatz dazu
ich kümmere mich nur im die (struktur die classen lasse ich weg):
lib.menu = HMENU
lib.menu {
1 = TMENU
1.wrap = ul id=topmenu|/ul
1.NO.wrapItemAndSub = li|/li
2 = TMENU
2.wrap = divul|/ul/div
2.NO.wrap = lih2|/h2/li |*| li|/li |*| li|/li
}
das sollte dir die struktur geben.
ist jetzt ungeteste und einfach mal so hier in die mail geschrieben.
aber ich denke die Idee ist erkennbar.
- --
Christian Wolff // Berlin
http://www.connye.com
some projects:
http://richtermediagroup.com | http://titanic.de |
http://fairplay-homepage.de
-BEGIN PGP SIGNATURE-
Version: GnuPG v1.4.9 (MingW32)
iEYEARECAAYFAkwIrVEACgkQIcCaXPh/JHHKTQCfZRrnVWJrvDjxCRkENJ7gK6GE
X0kAoKt4XYfdmVdAqt6n+Xj5h2ZuLfhP
=iP6I
-END PGP SIGNATURE-
Hallo Christian,
danke erstmal für die schnelle Hilfe.
Dein Vorschlag hat mich schon ein wenig weiter gebracht. Musste das wrap
durch allWrap ersetzen, danach kam dann folgende Anzeige:
div class=sub
ul class=test
li
h2a href=# onfocus=blurLink(this); class=linklink/a/h2
/li
li class=ttt
h2a href=# onfocus=blurLink(this); class=linklink/a/h2
/li
li class=ttt
h2a href=/ onfocus=blurLink(this); class=linklink/a/h2
/li
!-- DIE 3 EBENE --
li a href=/1/ onfocus=blurLink(this); class=11/a/li
li a href=/2/ onfocus=blurLink(this); class=22/a/li
li a href=/3/ onfocus=blurLink(this); class=33/a/li
li a href=/4/ onfocus=blurLink(this); class=44/a/li
!-- DIE 3 EBENE --
li class=ttt
h2a href= onfocus=blurLink(this); class=5link/a/h2
/li
li class=mmm
h2a href= onfocus=blurLink(this); class=5link/a/h2
/li
/ul
/div
Wie Du sehen kannst, werden jetzt die h2 gesetzt, allerdings wird mir
die 3. Ebene erst nachträglich eingefügt und nicht zu dem jeweiligen
Unterpunkt.
Zu Testzwecken habe ich die 3. Ebene einfach mal einkopiert.
### Menü ###
lib.MENU = HMENU
lib.MENU {
entryLevel = 1
### Erste Ebene ###
1 = TMENU
1 {
wrap = ul class=menu|/ul
NO {
ATagParams = class = {field:tx_realurl_pathsegment}
allStdWrap.insertData = 1
expAll = 1
wrapItemAndSub = li onmouseover=show(this)
onmouseout=hide(this)|/li
stdWrap.cObject = COA
stdWrap.cObject {
20 = TEXT
20.wrap = |
20.field = subtitle
}
}
ACT .NO
ACT = 1
ACT {
ATagParams = class = {field:tx_realurl_pathsegment}
allStdWrap.insertData = 1
}
}
### Zweite Ebene ###
2 = TMENU
2 {
ATagParams = class = {field:tx_realurl_pathsegment}
allStdWrap.insertData = 1
wrap = div class=subul class=test|/ul/div
NO {
ATagParams = class = {field:tx_realurl_pathsegment}
allStdWrap.insertData = 1
expAll = 1
allWrap = lih2|/h2/li |*| li class=ttth2|/h2/li
|*| li class=mmmh2|/h2/li
stdWrap.cObject = COA
stdWrap.cObject {
20 = TEXT
20.wrap = |
20.field = subtitle
}
}
}
3 .2
Mein Problem besteht also darin, meine 3. Ebene innerhalb 2.NO.allWrap
zu bekommen.
Gruß
Torsten
___
TYPO3-german mailing list
TYPO3-german@lists.typo3.org
http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] CSS-Dropdown in TS nachbauen
JoH asenau schrieb:
Mein Problem besteht also darin, meine 3. Ebene innerhalb 2.NO.allWrap
zu bekommen.
Dafür gibt's im TMENUITEM
wrapItemAndSub = li|/li
oder - falls Du mit allWrap Co. arbeiten willst:
allWrap = li|
wrapItemAndSub = |/li
HTH
Joey
Also, dass sieht jetzt schon viel besser aus, dank eurer Hilfe!
Vielen Dank erstmal.
Jetzt habe ich noch eine Sache, nämlich den entryLevel.
Mache ich keinen rein, dann nimmt er den oberesten Punkt und das ist
nicht gut, da ich mehrere Domains unter Typo3 laufen habe, so dass ich
dann alle Domains aufgelistet bekomme.
Ich möchte aber auf allen Seiten immer dieselbe Auflistung im Menü
haben, unabhängig davon, wo ich mich befinde.
Wenn ihr mir da noch einen Tip geben könntet, zünde ich auch eine Kerze
für euch an :-D
TS sieht im Moment so aus:
Das h2 hab ich ins wrap verschoben, da es sonst (logischer Weise) um
alles den Tag gesetzt hätte.
### Menü ###
lib.MENU = HMENU
lib.MENU {
entryLevel = 1
### Erste Ebene ###
1 = TMENU
1 {
wrap = ul class=menu|/ul
NO {
ATagParams = class = {field:tx_realurl_pathsegment}
allStdWrap.insertData = 1
expAll = 1
wrapItemAndSub = li onmouseover=show(this)
onmouseout=hide(this)|/li
stdWrap.cObject = COA
stdWrap.cObject {
20 = TEXT
20.wrap = |
20.field = subtitle
}
}
ACT .NO
ACT = 1
ACT {
ATagParams = class = {field:tx_realurl_pathsegment}
allStdWrap.insertData = 1
}
}
### Zweite Ebene ###
2 = TMENU
2 {
ATagParams = class = {field:tx_realurl_pathsegment}
allStdWrap.insertData = 1
wrap = div class=sub|/div
NO {
ATagParams = class = {field:tx_realurl_pathsegment}
allStdWrap.insertData = 1
expAll = 1
wrapItemAndSub = ulli|/li/ul |*| ulli
class=ttt|/li/ul |*| ulli class=mmm|/li/ul
stdWrap.cObject = COA
stdWrap.cObject {
20 = TEXT
20.wrap = h2|/h2
20.field = subtitle
}
}
}
3 = TMENU
3 {
ATagParams = class = {field:tx_realurl_pathsegment}
allStdWrap.insertData = 1
NO {
ATagParams = class = {field:tx_realurl_pathsegment}
allStdWrap.insertData = 1
# expAll = 1
allWrap = li|/li
stdWrap.cObject = COA
stdWrap.cObject {
20 = TEXT
20.wrap = |
20.field = subtitle
}
}
}
}
___
TYPO3-german mailing list
TYPO3-german@lists.typo3.org
http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] CSS-Dropdown in TS nachbauen
Jetzt habe ich noch eine Sache, nämlich den entryLevel. Mache ich keinen rein, dann nimmt er den oberesten Punkt und das ist nicht gut, da ich mehrere Domains unter Typo3 laufen habe, so dass ich dann alle Domains aufgelistet bekomme. Ich möchte aber auf allen Seiten immer dieselbe Auflistung im Menü haben, unabhängig davon, wo ich mich befinde. Schmeiß mal entryLevel raus und nimm stattdessen: special = directory special.value = 123 123 wäre die ID der Elternseite, unterhalb derer das Menü beginnen soll. HTH Joey -- Wenn man keine Ahnung hat: Einfach mal Fresse halten! (If you have no clues: simply shut your gob sometimes!) Dieter Nuhr, German comedian Xing: http://contact.cybercraft.de Twitter: http://twitter.com/bunnyfield TYPO3 cookbook (2nd edition): http://www.typo3experts.com ___ TYPO3-german mailing list TYPO3-german@lists.typo3.org http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] CSS-Dropdown in TS nachbauen
JoH asenau schrieb: Jetzt habe ich noch eine Sache, nämlich den entryLevel. Mache ich keinen rein, dann nimmt er den oberesten Punkt und das ist nicht gut, da ich mehrere Domains unter Typo3 laufen habe, so dass ich dann alle Domains aufgelistet bekomme. Ich möchte aber auf allen Seiten immer dieselbe Auflistung im Menü haben, unabhängig davon, wo ich mich befinde. Schmeiß mal entryLevel raus und nimm stattdessen: special = directory special.value = 123 123 wäre die ID der Elternseite, unterhalb derer das Menü beginnen soll. HTH Joey Hmpf, so langsam glaube ich, dass mich das Menu veräppeln will. Nehme ich special = directory dekliniert er die Menues nicht bis unten durch, sondern zeigt nur die 1. Ebene. Auch wenn ich auf einen Link klicke, der Unterverzeichnisse hat, zeigt er nichts an. Nur wenn ich eine Unterseite (3 Ebene) anklicke, werden die Links (Unterseiten) angezeigt, ABER auch nur für z.B. Seite 2. Also: Seite 1 Seite 2 -Seite 2 Unterseite --Seite 2 Unterseite 1* (aktiv)* --Seite 2 Unterseite 2 (sichtbar) --Seite 2 Unterseite 3 (sichtbar) --Seite 2 Unterseite 4 (sichtbar) Seite 3 --Seite 3 Unterseite 1 (nicht sichtbar) --Seite 3 Unterseite 2 (nicht sichtbar) --Seite 3 Unterseite 3 (nicht sichtbar) --Seite 3 Unterseite 4 (nicht sichtbar) Unterseiten für Seite 2 werden angezeigt, für Seite 3 nicht. Wo habe ich denn jetzt den Knoten im Hirn?! :-( Gruß Torsten ___ TYPO3-german mailing list TYPO3-german@lists.typo3.org http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
