Recent Questions
Q: Can you please give me tips on how I can style all menuitems to have font bold when selected and normal font when not selected?
A: Unfortunately, Deluxe Tree doesn't have such a feature. You can onlyset it's color. You cannot set the font of menu item bold when selected.
You can set menu item's font bold onMouseover, see example here:
http://deluxe-tree.com/data-templates/vista-style-7-template-sample.html
You should addthe following code in your data file:
function changeFont(obj, over)
{
obj.style.fontWeight = over ? 'bold' : 'normal';
obj.style.fontSize = over ? '13px' : '12px'; // You can not use this line
}
var tmenuItems = [
["<div onMouseOver='changeFont(this, 1)' onMouseOut='changeFont(this, 0)'>Security</div>","", "", "", "", "", "", "", "", ],
["<div onMouseOver='changeFont(this, 1)' onMouseOut='changeFont(this, 0)'>Ease of Access</div>","", "", "", "", "", "", "", "", ],
["|<div onMouseOver='changeFont(this, 1)' onMouseOut='changeFont(this, 0)'>Internet Options</div>","", "", "", "", "", "", "", "", ],
["|<div onMouseOver='changeFont(this, 1)' onMouseOut='changeFont(this, 0)'>Windows Firewall</div>","", "", "", "", "", "", "", "", ],
["<div onMouseOver='changeFont(this, 1)' onMouseOut='changeFont(this, 0)'>Network and Internet</div>","", "", "", "", "", "", "", "", ],
["<div onMouseOver='changeFont(this, 1)' onMouseOut='changeFont(this, 0)'>Hardware</div>","", "", "", "", "", "", "", "", ],
["<div onMouseOver='changeFont(this, 1)' onMouseOut='changeFont(this, 0)'>Programs</div>","", "", "", "", "", "", "", "", ],
["<div onMouseOver='changeFont(this, 1)' onMouseOut='changeFont(this, 0)'>Appearance</div>","", "", "", "", "", "", "", "", ],
["|<div onMouseOver='changeFont(this, 1)' onMouseOut='changeFont(this, 0)'>User Accounts</div>","", "", "", "", "", "", "", "", ],
["|<div onMouseOver='changeFont(this, 1)' onMouseOut='changeFont(this, 0)'>Personalization</div>","", "", "", "", "", "", "", "", ],
["<div onMouseOver='changeFont(this, 1)' onMouseOut='changeFont(this, 0)'>Sound and Speech</div>","", "", "", "", "", "", "", "", ],
["<div onMouseOver='changeFont(this, 1)' onMouseOut='changeFont(this, 0)'>Additional Options</div>","", "", "", "", "", "", "", "", ],
];
Please, notice also that you should add this function every time whenyou change your menu in Deluxe Tuner application, as Tuner deletesthis function.
Q: Things are mostly working great. I want my menu to appear centered at the top the page. Here's the code:
<table style="text-align: left; width: 100%;" border="0" cellpadding="2"cellspacing="2">
<tbody>
<tr>
<td style="width: 100%; text-align: center;"><script type="text/javascript" src="navbar.js"></script>
</td>
</tr>
</tbody>
</table>
The table appears at the far left edge of the window. I tried with both absolute (x=20, y=10) and relative (both x and y unset) coordinates. Help!
A: If you want to center the menu paste itwithin the <div > or <table> with a static position and specify a center alignment for it, for example:
<DIV align=center>
<SCRIPT src="data/data.js" type=text/javascript>
</SCRIPT>
</DIV>
<table width=800>
<tr>
<td align=center width=600> </tr>
</table>
Please, set exact value for var menuWidth parameter, for example:
var menuWidth = "600px";
This can help to align your menu correctly in all browsers.
Try also to specify units in "px".
Set also:
var absolutePos = 0;
Q: How can I vary the width of the individual items on the main bar for the javascript menu?
A: You can use Individual Styles to set the width for the menu items.Please, use Deluxe Tuner to create your individual styles.
You should write for example so:
var itemStyles = [
["itemWidth=98px"], // style 0
["itemWidth=100px"], // style 1
["itemWidth=110px"], // style 2
["itemWidth=120px"], // style 3
["itemWidth=95px"], // style 4
];
var menuItems = [
["","", "data.files/products.gif", "data.files/products_mo.gif", "Products", "_self","0" , , , ],
["|XLCubed Edition","pro_excel.html", "data.files/iconBlue.gif", "data.files/iconWhite.gif", , "_self", , "0", , ],
["|Web Edition","pro_web.html", "data.files/iconBlue.gif", "data.files/iconWhite.gif", , "_self", , "0", , ],
["|TM1 Connection","tm1Connection.htm", "data.files/iconBlue.gif", "data.files/iconWhite.gif", , "_self", , "0", , ],
["|Downloads","downloads.htm", "data.files/iconBlue.gif", "data.files/iconWhite.gif", , , , , , ],
["","", "data.files/demoCenter.gif", "data.files/demoCenter_mo.gif", , ,"1", , , ],
["|Online Demos","onlineDemos.htm", "data.files/iconBlue.gif", "data.files/iconWhite.gif", , "_self", , "1", , ],
["","", "data.files/resources.gif", "data.files/resources_mo.gif", , ,"2", , , ],
["|Customer Center","customer.htm", "data.files/iconBlue.gif", "data.files/iconWhite.gif", , "_self", , "1", , ],
["|Partner Center","partnerCenter.htm", "data.files/iconBlue.gif", "data.files/iconWhite.gif", , "_self", , , , ],
["|Documents","documents.htm", "data.files/iconBlue.gif", "data.files/iconWhite.gif", , "_self", , "1", , ],
["|Technical Specs","techSpecs.htm", "data.files/iconBlue.gif", "data.files/iconWhite.gif", , "_self", , "1", , ],
["|Training","training.htm", "data.files/iconBlue.gif", "data.files/iconWhite.gif", , "_self","3", "1", , ],
["","support.htm", "data.files/support.gif", "data.files/support_mo.gif", , "_self","4", , , ],
["","", "data.files/company.gif", "data.files/company_mo.gif", , , , , , ],
["|History","history.htm", "data.files/iconBlue.gif", "data.files/iconWhite.gif", , "_self", , "1", , ],
["|Contact Us","contactUs.htm", "data.files/iconBlue.gif", "data.files/iconWhite.gif", , "_self", , "1", , ],
];
Q: Hello, Could you please help me with an alignnment issue with my website. If you go to mt website you will see the problem. I set the x alignment to=266 but the y alignment is left blank because I would like to keep the menu centered on the site.
A: If you want to center the menu paste itwithin the <div> or <table> with a static position and specify a center alignment for it, for example:
<DIV align=center>
<SCRIPT src="data/data.js" type=text/javascript>
</SCRIPT>
</DIV>
Please, set exact value for var menuWidth parameter, for example:
var menuWidth = "300px";
This can help to align your menu correctly in all browsers.
Try also to specify units in "px".
Set also:
var absolutePos = 0;
Try that.
