[Typo3] Optimisation of Typoscript

JoH info at cybercraft.de
Fri Jun 3 22:54:22 CEST 2005


> I have the following TypoScript:
>
> lib.header = HMENU
> lib.header {
>    special = directory
>    special.value = 833
>    1 = TMENU
>    1 {
>      NO.before = |*|<p class="button_yellow"
> onmouseover="this.className='button_yellow_over'"
> onmouseout="this.className='button_yellow'"> || <p
> class="button_green" onmouseover="this.className='button_green_over'"
> onmouseout="this.className='button_green'"> || <p class="button_blue"
> onmouseover="this.className='button_blue_over'"
> onmouseout="this.className='button_blue'">|*|
>      NO.after = </p>
>      NO.stdWrap.htmlSpecialChars = 1
>    }
> }
>
> which takes a directory and makes a menu out of it. Three paragraph
> styles are rotated to render the menu elements. Each paragraph has
> javascript calls for changing the styles when the menu item is rolled
> over. This works fine and, yes, I know it could (or maybe should) be
> done with a GMENU rather than a TMENU. I like this solution because my
> client can edit just the CSS stylesheet.
>
> My question is how can I make this script more readable? I would like
> to have something like:
>
> style = |*| button_yellow || button_green || button_blue |*|
>
> and then insert this value into my <p class="... etc. rather than
> repeat the whole code every time.

Well - I really don't know, why you want to hassle with those p-tags and
JavaScript onmouseover ...
Use the class for the a-tag itself and you're done.

1 = TMENU
1 {
   NO {
    ATagParams = |*|class="yellow"||class="green||class="blue"|*|
   }
}

Then you can use pseudoclasses to get the hovering effect without JS.
And at least for a-tags it works in IE too.

a.yellow:link { ### some css here ### }
a.yellow:visited { ### some css here ### }
a.yellow:hover { ### some css here ### }
a.yellow:active { ### some css here ### }

a.green:link { ### some css here ### }
a.green:visited { ### some css here ### }
a.green:hover { ### some css here ### }
a.green:active { ### some css here ### }

a.blue:link { ### some css here ### }
a.blue:visited { ### some css here ### }
a.blue:hover { ### some css here ### }
a.blue:active { ### some css here ### }

Tested and working.

Joey

-- 
Wenn man keine Ahnung hat: Einfach mal Fresse halten!
(If you have no clues: simply shut your knob sometimes!)
Dieter Nuhr, German comedian
openBC: http://www.openbc.com/go/invuid/Jo_Hasenau





More information about the TYPO3-english mailing list