Christian Wolff schrieb:
> On Thu, 14 Feb 2008 08:59:14 +0100, Jochen Graf <[EMAIL PROTECTED]> wrote:
>
>
>> Hallo,
>> ich habe auf meiner Seite ein TMENU
>>
>> temp.navi = HMENU
>> temp.navi {
>> entryLevel = 1
>> excludeUidList =
>> 1 = TMENU
>> 1 {
>> # werden auch alle unterebenen angezeigt
>> expAll = 0
>> NO = 1
>> NO.wrap = <ul class="coolnav">|</ul>
>> NO.wrapItemAndSub = <li> |</li>
>> NO.ATagTitle.field = abstract // description // title
>> # So wird der span eingebunden.
>> # <li><a href="#"><span>News</span></a></li>
>> NO.stdWrap.wrap = <span>|</span>
>> CUR < .NO
>> CUR.ATagParams = style="color:#768eb0;font-size:11pt";
>> # Unternavigation 2. Ebene:
>> }
>> 2 = TMENU
>> 2 {
>> # werden auch alle unterebenen angezeigt
>> expAll = 0
>> NO = 1
>> NO.wrap = <ul class="subnav">|</ul>
>> NO.wrapItemAndSub = <li> |</li>
>> NO.ATagTitle.field = abstract // description // title
>> NO.stdWrap.wrap = <span>|</span>
>> CUR < .NO
>> CUR.ATagParams = style="color:#768eb0;font-size:13pt";
>> }
>>
>> }
>>
>>
>> Das auch soweit geht.
>> Nun wollte ich das subnav mit css formatieren, damit das untere Menü
>> etwas eingerückt ist, jedoch klappt das nicht.
>>
>> .subnav li a {
>> margin-left:10px;
>> line-height: 43px;
>> height: 23px;
>> display:block;
>> color:#051541;
>> text-decoration: none;
>> text-indent: 7px;
>> font-weight: bold;
>> background-color: red;
>> border: 1px solid red;
>> border-left-width: 0px;
>> border-right-width: 0px;
>> border-top-color: #d9dfe7;
>> }
>>
>> .subnav li a span {
>> height: 23px;
>> display:block;
>> margin-left: 24px;
>> background-color: red;
>> }
>>
>> .subnav li a:hover {
>> background-color: #f2f2f2;
>> }
>>
>> hier mal das Menü "bitte auf Prof. Dr. Wolfgang Schnotz" klicken.
>> http://typo1.uni-landau.de/index.php?id=27
>>
>> Ist es auch möglich, die Formatierung für das Untermenu direkt im
>> Typoscript zu machen oder ist eine css Klasse zwingend erforderlich?
>>
>> Habe immer noch Verständisprobleme bei Menüs mit CSS . Kennt jemad eine
>> gute Doku im Netz die das Eschritt für Schritt erklärt?
>>
>>
> Hallo Jochen,
> natürlich währe es möglich. die formatierung auch direct in TypoScript zu
> machen.
> aber das ist un-elegant.
>
> weil dann jedes list item eventuell eine relativ lange style="" definition
> hätte.
>
> da ist es praktischer das per css zu machen.
>
> momentan sieht es sol aus als würdest du gar kein sub menü erzeugen denn
> die classe "subnav" taucht im quellcode nicht auf.
>
> für so ein "debugging" empfehle ich dir die firfox extension firebug
>
> mit dieser extension kannst du sehr einfach einsehen welche elemente welche
> attriebute haben. und auch testweise direct im browser einzelne werte
> überschreiben um z.b zu gucken
> wie es sich auswirkt.
>
> hier noch ein paar generelle tipps zu menüs mit CSS
>
> in der regel verwendt man versachchtelte en list. um folgendes konstruckt
> zu bekommen:
>
> * Hauptpunkt
> * Sub
> * Sub
> * Hauptpunkt
> * Hauptpunkt
> * Sub
> * Sub
>
>
> bis dahin ist das pures html.
>
> das html dazu sieht ungefähr so aus (hab mal alle attriebute rausgeworfen
> ums kompakter zu machen):
> <ul id="navi">
> <li><a>Hauptpunkt</a>
> <ul>
> <li><a>sub</a></li>
> <li><a>sub</a></li>
> </ul>
> </li>
> <li><a>Hauptpunkt</a></li>
> <li><a>Hauptpunkt</a>
> <ul>
> <li><a>sub</a></li>
> <li><a>sub</a></li>
> </ul>
> </li>
> </ul>
>
>
> auf basis dieses htmls kann man jetzt die gestaltung machen.
> zu erstmal sagt man der liste die basics:
>
> ul#navi{margin:0;padding:0;}
>
> ul#navi li{
> margin:0;
> list-style-image:none;
> }
>
> als nächstes können wir z.b sagen wir wollen das unterpunkte eingerückt
> sind das würde ich
> über folgende regel machen:
>
> ul#navi li li {margin-left:20px}
>
> dann kannst du natürlich noch dem link ein bisschen gestlatung mitgeben.
> /* erste ebene */
> ul#navi li a {background:#eee}
>
> /* zweite ebene */
> ul#navi li li a {background:#ccc}
>
> man kann mit diesen listen konsruckten auch noch ganz andere sachen bauen:
> z.b Suckerfish dropdowns
> http://www.alistapart.com/articles/dropdowns/
>
> dieses listen konstruckt wenn man es erstmal verstanden hat ist sehr
> unviersell für
> hirachiche menü struckturen einsetzbar. und selbst ohne CSS noch für den
> leser verständlich.
>
> soll ja bis weilen leute geben die mit text browsern oder sowas daher
> kommen *g*
>
> gruss chris
>
>
>
Hallo Chris,
danke für deine ausfürliche Beschreibung, bin nun einen Schritt weiter
gekommen, habe aber beim Submenü noch Darstellungsprobleme.
Nun bin ich mir nicht sicher weshalb dieser Fehler Auftriit, denn das
Menu wird ja im TS kopiert.
Wenn man beim Submenü den Link klickt, geht die Formatierung verloren.
http://typo1.uni-landau.de/index.php?id=30
temp.navi = HMENU
temp.navi {
entryLevel = 1
excludeUidList =
1 = TMENU
1 {
# werden auch alle unterebenen angezeigt
expAll = 0
NO = 1
NO.wrap = <ul class="coolnav">|</ul>
NO.wrapItemAndSub = <li> |</li>
NO.ATagTitle.field = abstract // description // title
# So wird der span eingebunden.
# <li><a href="#"><span>News</span></a></li>
NO.stdWrap.wrap = <span>|</span>
CUR < .NO
CUR.ATagParams = style="color:#768eb0;font-size:11pt";
# Unternavigation 2. Ebene:
}
2 = TMENU
2 {
noBlur = 1
expAll = 0
wrap = <ul class="subnav">|</ul>
NO = 1
NO {
ATagTitle.field = abstract // description // title
wrapItemAndSub = <li>|</li>
stdWrap.wrap = <span>|</span>
}
CUR < .NO
CUR.doNotLinkIt = 1
CUR.ATagParams = style="color:#768eb0;font-size:13pt";
}
}
2 < .1
}
Viele Grüsse Jochen
_______________________________________________
TYPO3-german mailing list
[email protected]
http://lists.netfielders.de/cgi-bin/mailman/listinfo/typo3-german
