[TYPO3-german] typoscript textmenü einzelnen menüeintrag durch grafik tag ersetzen

[Christian Bernhardt]

danke, mal sehen, vielleicht mache ich es dann auch so ...

Am 27.07.2011 16:00, schrieb Heike Herzog-Kuhnke:
> Hallo Christian,
>
> Ich löse das auf meiner Homepage per CSS. Der Text wird "weggeschoben 
> und durch ein Hintergrundbild ersetzt. Ich mache das für alle 
> "Hauptpunkte" in meinem Menu.
>
> Im Feld subtitle habe ich jeweils die Id hinterlegt (könnte man auch 
> mit einer Konstanten machen)
>
>       page.20.marks.MENU_OBEN = HMENU
>       page.20.marks.MENU_OBEN {
>         special = directory
>         special.value = 7
>         expAll = 0
>         wrap = <div class = "hlist">|</div>
>         1 = TMENU
>         1.wrap = <ul>|</ul>
>         1.noBlur = 1
>         1.NO = 1
>         1.NO.wrapItemAndSub.insertData = 1
>         1.NO.wrapItemAndSub = <li id="{field:subtitle}">|</li>
>         }
>
> Über die id wird dann per css der Rest gesteuert:
> (ich nutze YAML, falls jemandem die Begriffe bekannt vorkommen ;)
>
> Hierfür habe ich zwei png-Dateien, die quasi jeden Menueintrag 
> enthalten. Diese binde ich per CSS für die Listenpunkte meines Menus ein:
>
>   .hlist ul li {
>     /* (en|de) Bugfix:IE - Doubled Float Margin Bug */
>     display:inline;
>     float:left; /* LTR */
>     font-size:1.0em;
>     line-height:6em;
>     list-style-type:none;
>     margin:0;
>     padding:0;
>   text-indent: -9999px; <---- hier wird rausgeschubst
>   }
>
>   .hlist ul li a,
>   .hlist ul li strong {
>     background:transparent;
>     display:block;
>     font-size:1em;
>     font-weight:bold;
>     margin:0;
>     text-decoration:none;
>     background-image: url(../../images/hg_topnav_normal.png);
>   }
>
>   .hlist ul li a:focus,
>   .hlist ul li a:hover,
>   .hlist ul li a:active  {background: transparent;
>     text-decoration:none; outline: 0 none;
>     background-image: url(../../images/hg_topnav_over.png);
> }
>
> Jeder Menupunkt hat eine eigene id und damit wird das Bild verschoben:
>
>   #nav .hlist ul li#start a:hover {
>          width: 130px;
>          background-position: -620px 0px;}
>   #nav .hlist ul li#start a:active {
>          width: 130px;
>          background-position: -620px 0px;}
>   #nav .hlist ul li#start strong {
>          width: 130px;
>          background-position: -620px 0px;}
>
> ...
>
> Die Definition für strong steht bei mir noch ungenutzt drin, da mir 
> der Effekt reicht und ich bisher noch nicht umgestellt habe, dass die 
> aktive Seite anders formatiert wird.
>
> Hoffe es hilft Dir weiter.
> Gruß
>
> Heike
> _______________________________________________
> TYPO3-german mailing list
> TYPO3-german at lists.typo3.org
> http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german