[TYPO3-english] two column drop down

[Ron Hall]

Hello Doug,

If you just want a menu like the example then I would use a straight  
TMENU and style with CSS as Arial and Arial Black. This would be a lot  
lighter on the code and quicker loading.

However, if you want a graphic menu because of a special font then I  
would approach it differently.

I would still create a TMENU and use image resource to create CSS  
background images with both a normal and hover state.

Here is the code I use to create such a menu. This example only has  
one layer, but you could add additional layers. The real trick will be  
getting your CSS to handle them properly and across browsers. Also,  
the example varies the width of the <li> tags to the width of the  
background images. On the second layer you would want to fix that  
width. Of course, you then need to make sure that all your navigation  
titles will fit on one line within that width.

Anyway, that is how I would think about doing it.

Ron Hall

EXAMPLE:

globalMenu = HMENU
globalMenu.entryLevel = 0
globalMenu.wrap = <ul id="globalMenu">|</ul><!-- end #globalMenu  -->
globalMenu.1 = TMENU
globalMenu.1 {
	noBlur = 1
	NO.before = <li>|*|<li>|*|<li class="last">
	NO.after = </li>
	NO.ATagParams.stdWrap.cObject = COA
	NO.ATagParams.stdWrap.cObject.10 = IMG_RESOURCE
	NO.ATagParams.stdWrap.cObject.10 {
		file = GIFBUILDER
		file {
			XY = [20.w]+10,60
			backColor = #232a31
			transparentColor = #232a31
			20 = TEXT
			20 {
				text.field = nav_title // title
				fontSize = 34
				fontFile = fileadmin/templates/skin_bn_blue_demo/fonts/INKCALIG.TTF
				fontColor = #8894a0
				offset = 7,18
				niceText = 1
			}
			30 < .20
			### Build hover text
			50 < .20
			50 {
				fontColor = #00fffc
				offset = 7,50
			}
			60 < .50
			70 < .50
		}
		stdWrap.dataWrap = class="graphicText" style="background-image:  
url( /| );width:{TSFE:lastImgResourceInfo|0}px"
	}
	ACT = 1
	ACT.before = <li class="active">|*|<li class="active">|*|<li  
class="active last">
	ACT.after = </li>
	ACT.ATagParams < .NO.ATagParams
}






On May 2, 2009, at 5:47 AM, David Bruchmann wrote:

> ----- Ursprüngliche Nachricht -----
> Von:        La Farge Douglas <doug at gcnpublishing.com>
> Gesendet:   Donnerstag, 30. April 2009 21:03:36
> An:         TYPO3 English <typo3-english at lists.netfielders.de>
> CC:
> Betreff:    [TYPO3-english] two column drop down
>> Hi All,
>>
>> We use tmenu_layers and gmenu_layers to generate navigation.
>>
>> http://www.oilonline.com as an example.
>>
>> IS there a way to generate dropdown menus with two columns of links
>> rather than the one column as seen in the above example?
>>
>> A configuration I can't locate with g/tmenu_layers?  Another menu
>> extension?
>>
>> thanks in advance,
>> doug
>>
>> -+-+-+-+-+-+-+-+-+-+-+-+-+
>> Doug La Farge
>> GCN Publishing, Inc.
>> 203.665.6211 x209
>> 928.699.0663 (cell)
>> Internet Software & Services For Today's Media Companies
>> www.gcnpublishing.com * www.bg2go.com
>>
>
> Hi Doug,
>
>
> an easy way is to do it by floating divs but it 'sorts' the links  
> like this:
>
> main
>   | a | b |
>   | c | d |
>
> This can be done by only changing the CSS.
>
> When you want another sorting like that:
>
> main
>   | a | c |
>   | b | d |
>
> you need a special TS for sorting the the links.
>
> Best Regards
> David
> _______________________________________________
> TYPO3-english mailing list
> TYPO3-english at lists.netfielders.de
> http://lists.netfielders.de/cgi-bin/mailman/listinfo/typo3-english
>