I would like to demonstrate a final powerful feature of the GMENU object: Extending a background image over the whole menu:
Based on this menu:
page.includeLibs.gmenu_layers = media/scripts/gmenu_layers.php
page.10 = HMENU
page.10.1 = GMENU_LAYERS
page.10.1 {layerStyle = position:absolute;left:0px;top:30px;width:10px;VISIBILITY:hidden;
xPosOffset =-10
lockPosition = x
expAll=1
NO {backColor = #cccccc
XY = [10.w]+10, 14
10 = TEXT
10.text.field = title
10.offset = 5,10
}
}
page.10.2 = GMENU
page.10.2.wrap = |<BR>
page.10.2.NO {backColor = #99cccc
XY = 200, 20
10 = TEXT
10.text.field = title
10.offset = 5,15
10.fontColor = white
10.niceText = 1
10.fontSize = 20
}
... add these lines:
...
page.10.2 = GMENU
page.10.2.wrap = |<BR>
page.10.2.NO {backColor = #99cccc
XY = 200, 20
5 = IMAGE
5.file = fileadmin/tsbyex/sunset_keywest.jpg
10 = TEXT
10.text.field = title
10.offset = 5,15
...
That inserted the sunset-image as background. But we would like that image to extend over the whole menu which is done by addition a property to the GMENU-object about which GIFBUILDER-objects to modify regarding offset values. So add:
page.10.2.applyTotalH = 5
... and this is what you get!
Regarding the property .applyTotalH, look it up in the TSref. Basically it's a pointer that works like this:
Finally you may create such menus but wish that you menu will always be as high as the background image in order not to crop it in the bottom. Then add this:
...
page.10.2 = GMENU
page.10.2.applyTotalH = 5
page.10.2.min = , 200
page.10.2.max = , 200
page.10.2.wrap = |<BR>
page.10.2.NO {backColor = #99cccc
XY = 200, 20
5 = IMAGE
5.file = fileadmin/tsbyex/sunset_keywest.jpg
5.height = 200
10 = TEXT
10.text.field = title
...
Result:
Notice: The properties .min and .max defines both x and y dimensions. In this case we specify only the y-dimension by the comma:
page.10.2.min = , 200
page.10.2.max = , 200
