Recent Questions Extjs Treepanel Recursin
Q: I would like to know how to define separator on itemstyle or how to show separator on menu items.
Thanking you in advance.
A: You should set a separator in the menuItems, for example:
var menuItems = [
["Home","index.cfm", , , , , , , , ],
["-"],
["About Us","about.cfm", , , , , , , , ],
];
Please, see the following parameters:
//--- Separators
var separatorImage=""; //for subitems
var separatorWidth="100%";
var separatorHeight="3px";
var separatorAlignment="right";
var separatorVImage="images/public/separator.gif"; //for the top items
var separatorVWidth="100%";
var separatorVHeight="2px";
var separatorPadding="";
Q: I am trying to follow your directions on how to load the application and I am completely lost as to what I need to do.
Do you have instructions on how operate the application; I am having a very difficult problem trying to maneuver around.
I am looking to create css vertical tabs, and the tabs are my personal images and I want to place html text into tabs.
A: To set your own images for tabs you should use the following
parameters (see how we created images in the attached example):
var bitemBackImage=["img/styleIE7_n_back.gif","img/styleIE7_o_back.gif","img/styleIE7_s_back.gif"];
var bbeforeItemImage=["img/styleIE7_n_left.gif","img/styleIE7_o_left.gif","img/styleIE7_s_left.gif"];
var bafterItemImage=["img/styleIE7_n_right.gif","img/styleIE7_o_right.gif","img/styleIE7_s_right.gif"];
You can also use a whole images for you tabs you should use only
var bitemBackImage=["img/styleIE7_n_back.gif","img/styleIE7_o_back.gif","img/styleIE7_s_back.gif"];
Set the dimensions of the menu here:
var bmenuWidth="600px";
var bmenuHeight="33px";
See in Deluxe Tabs there are two modes:
1. var tabMode=0;
You can create only one level of tabs and assign Object Id's of the
DIV's to show when you click on the tab.
["XP Tab 1","content1", "", "", "", "", "", "", "", ],
["XP Tab 2","content2", "", "", "", "", "", "", "", ],
["XP Tab 3","content3", "", "", "", "", "", "", "", ],
["XP Tab 4","content4", "", "", "", "", "", "", "", ],
2. var tabMode=1;
You can assign only links in this mode.
You should create top level items with subitems.
["XP Tab 1","", "", "", "", "", "", "", "", ],
["|Link 1_1","http://deluxe-tabs.com", "", "", "", "", "0", "", "", ],
["|Link 1_2","testlink.htm", "", "", "", "", "0", "", "", ],
["|Link 1_3","testlink.htm", "", "", "", "", "0", "", "", ],
["|Link 1_4","testlink.htm", "", "", "", "", "0", "", "", ],
["|Link 1_5","testlink.htm", "", "", "", "", "0", "", "", ],
["XP Tab 2","", "", "", "", "", "", "", "", ],
["|Link 2_1","testlink.htm", "", "", "", "", "0", "", "", ],
["|Link 2_2","testlink.htm", "", "", "", "", "0", "", "", ],
["|Link 2_3","testlink.htm", "", "", "", "", "0", "", "", ],
["|Link 2_4","testlink.htm", "", "", "", "", "0", "", "", ],
["|Link 2_5","testlink.htm", "", "", "", "", "0", "", "", ],
["XP Tab 3","", "", "", "", "", "", "", "", ],
["|Link 3_1","testlink.htm", "", "", "", "", "0", "", "", ],
["|Link 3_2","testlink.htm", "", "", "", "", "0", "", "", ],
["|Link 3_3","testlink.htm", "", "", "", "", "0", "", "", ],
["|Link 3_4","testlink.htm", "", "", "", "", "0", "", "", ],
["|Link 3_5","testlink.htm", "", "", "", "", "0", "", "", ],
You can use Object ID as well as Link in both modes. Use the following prefixes within item's link field:
"object:" - means that there is object id after it;
"link:" - means that there is a link after it.
"javascript:" - means that there is a javascript code after it, for example:javascript:alert(\'Hello!\')
So, you should write for example:
["|Link 1_1","object:Content1_1", "", "", "", "", "0", "", "", ],
Q: I am having problems with my html files that are located in sub folders of my site the menu html does not work on them.If they are in the root directory there is no problem.
A: You can use additional parameters to make menu paths absolute:
var pathPrefix_img = "http://domain.com/images/";
var pathPrefix_link = "http://domain.com/pages/";
These parameters allow to make images and links paths absolute.
For example:
var pathPrefix_img = "http://domain.com/images/";
var pathPrefix_link = "http://domain.com/pages/";
var menuItems = [
["text", "index.html", "icon1.gif", "icon2.gif"],
];
So, link path will be look so:
http://domain.com/pages/index.html
Images paths will be look so:
http://domain.com/images/icon1.gif
http://domain.com/images/icon2.gif
Q: Is it possible via code customization to remove the border only for the top level of popup navigation
and subsequent menu levels with the border?
If yes, would you provide technical assistance with the required code change?
A: You can use Individual Item Style in that case.
You should create Individual Style, for example:
var itemStyles = [
["itemBorderStyle=none,none"], // style 0
];
And assign it for top items:
var menuItems = [
["Home","testlink.html", "", "", "", "", "0", "", "", "", "", ], // assign style 0
["Product Info","", "deluxe-menu.files/icon1.gif", "deluxe-menu.files/icon1o.gif", "", "", "0", "", "", "", "", ], // assign style 0
["|Features","testlink.html", "deluxe-menu.files/icon2.gif", "deluxe-menu.files/icon2o.gif", "", "", "", "", "", "", "", ],
["|Installation","", "deluxe-menu.files/icon2.gif", "deluxe-menu.files/icon2o.gif", "", "", "", "", "", "", "", ],
["|Supported Browsers","", "deluxe-menu.files/icon2.gif", "deluxe-menu.files/icon2o.gif", "", "", "", "", "", "", "", ],
["||Windows OS","", "deluxe-menu.files/icon3.gif", "deluxe-menu.files/icon3o.gif", "", "", "", "", "", "", "", ],
["||Internet Explorer","", "deluxe-menu.files/icon5.gif", "deluxe-menu.files/icon5o.gif", "", "", "", "", "", "", "", ],
["||Firefox","", "deluxe-menu.files/icon5.gif", "deluxe-menu.files/icon5o.gif", "", "", "", "", "", "", "", ],
["Samples","", "deluxe-menu.files/icon1.gif", "deluxe-menu.files/icon1o.gif", "", "", "0", "", "", "", "", ], // assign style 0
["|Sample 1","testlink.html", "deluxe-menu.files/icon6.gif", "deluxe-menu.files/icon6o.gif", "", "", "", "", "", "", "", ],
["|Sample 2 is Disabled","testlink.html", "deluxe-menu.files/icon6.gif", "deluxe-menu.files/icon6o.gif", "", "_", "", "", "", "", "", ],
["Purchase","http://deluxe-menu.com/order-purchase.html", "deluxe-menu.files/icon1.gif", "deluxe-menu.files/icon1o.gif", "", "_blank", "0", "", "", "", "", ], // assign style 0
["Contact Us","testlink.htm", "deluxe-menu.files/icon1.gif", "deluxe-menu.files/icon1o.gif", "", "", "0", "", "", "", "", ], // assign style 0
];
More info you'll find here:
http://deluxe-menu.com/individual-item-styles-info.html
