|
 | ||||||||||
|
|
|
|
|
|||||||
JavaScript ProjectsSTUDIO GRID TABLE MENU TREE XPBAR HINT EDITOR TAB FORM CALENDAR SCROLLER SHOPPINGCART TREEPHP PACKER |
|
CODETHATMENU MANUAL |
Menu Custom Borders
The simle syntax for borders definition you can see in many our examples.
For example:
border : {
width : 2, color : 'black'
}
|
For creation advanced custom borders you can use properties that described at the example below:
border :
{
width : 2, // default border width
color : 'black', // default border color,
// may not be used if needed
t : {
// top border description
size : 120, // not required, default size
// is menu width plus sum of left
// and right border width
offset : - 2, // offset from the left menu side.
// Default value is -<leftborder>.width
width : 3, // not required: border width,
// overrides the default value
color : 'red', // not required: border color,
// overrides the default value
el : [ // array of border elements
{
src : "img/url.gif", //image URL
width : 50, //element width
color : 'red' //element background color
},
...
]
},
b : {
// bottom border description,
// properties are the same as for top
...
},
l : {
// left border decription
size : 120, // default value is menu height
offset : - 3, // default value is 0
...
},
r : {
// right border description
size : 120, // default value is menu height
offset : - 3, // default value is 0
...
}
}
|
Below you can find more detailed information about several of these properties.
size - it's a height for vertical border and width for horizontal borders. By default vertical border size it's menu width plus sum of vertical borders width, horizontal border size is menu height.
offset - for vertical borders it's vertical offset relatively to the top menu edge, for horizontal borders - horizontal offset relatively to the left menu edge.
el - you can out here an image that will be a background for you border.
If you don't specify an image, menu use transparent image with appropriate width and height.
In case you'd like to create automatically extended border you shouldn't specify image for border left and right side and set center backroun image transparent:
el : [
{
src : 'img/ugolok1.gif', width : 10
},
{ },
{
src : 'img/ugolok2.gif', width : 10
} ]
|
Also you can specify an image but don't set image size. In this case image would be expanded automaticaly relatively to menu size.
Example - Menu Custom Borders
You can see an example where all enumerated features are present here - Menu Custom Borders [popup]
[ Home ] [ Forum ] [ Contacts ] [ Site Map ] [ News ] [ Links ] [ Sales & Prices ] [ Downloads ] |
[ Go Top ] |
© CodeThat.com, 2003-2008
Design by XTLabs, Inc.