Support Forum Softcomplex logo
About Us  | Services  | Download  | Order  | Support  | |
| Search | Today's Posts | Stats | Board Rules | Not logged in [ Login | Register ]
go to bottom
Last active: Never

Printable Version | Subscribe | Add to Favourites   Post new thread
Author: Subject: menu link
wms103006
Junior Member

Posts: 2
Registered: 12/11/2006
Member Is Offline
posted on 12/11/2006 at 07:08 AM Reply With Quote
menu link


I'm using the free version to test with and noticed that I'm having a drop in the menu color when I make one of the top level options as a link. My problem is when I mouse over the top menu level a pixel drop occurs. How do I correct this?

Here is my code:

menu_items.js
var MENU_ITEMS = [
['User Menu', null, null,
['Submit New Problem', '../user/new.asp'],
['View Problem List', '../user/view.asp'],
['Edit Information', '../user/register.asp?edit=1'],
],
['Admin', '../admin/'],
['Log Off', '../logoff.asp'],
];


menu_tpl.js
var MENU_POS = [{

'height': 21,
'width': 166,

'block_top': 156,
'block_left': 33,

'top': 0,
'left': 131,

'hide_delay': 200,
'expd_delay': 200,
'css' : {
'outer' : ['m0l0oout', 'm0l0oover'],
'inner' : ['m0l0iout', 'm0l0iover']
}
},{
'height': 21,
'width': 170,
'block_top': 22,
'block_left': 0,
'top': 23,
'left': 0,
'css' : {
'outer' : ['m0l1oout', 'm0l1oover'],
'inner' : ['m0l1iout', 'm0l1iover']
}
},{
'block_top': 5,
'block_left': 160
}
]
View User's Profile View All Posts By User U2U Member
wms103006
Junior Member

Posts: 2
Registered: 12/11/2006
Member Is Offline
posted on 12/11/2006 at 07:41 AM Reply With Quote

i did modify the css as follows:

menu.css
/* level 0 inner */
.m0l0iout {
font-family: Arial;
font-size: 12px;
text-decoration: none;
margin: 4px 0 0 8px;
color: #046F5B;
}
.m0l0iover {
font-family: Arial;
font-size: 12px;
text-decoration: underline;
margin: 5px 0 0 8px;
color: #046F5B;
}

/* level 0 outer */
.m0l0oout {
text-decoration : none;
border: 1px solid #0CFE0B4;
background-color: #CFE0B4;
}
.m0l0oover {
text-decoration : none;
background-color: #CFE0B4;
border: 1px solid #CFE0B4;
}

/* level 1 inner */
.m0l1iout {
font-family: Arial;
font-size: 12px;
margin: 4px 0 0 17px;
color: #046F5B;
}
.m0l1iover {
font-family: Arial;
font-size: 12px;
margin: 4px 0 0 17px;
color: #046F5B;
}

/* level 1 outer */
.m0l1oout {
text-decoration : none;
background-color: #CFE0B4;
border: 1px solid #CFE0B4;
padding: 0;
}
.m0l1oover {
text-decoration: underline;
color: #046F5B;
background-color: #CFE0B4;
background-repeat: no-repeat;
border: 1px solid #CFE0B4;
padding: 0;
}
View User's Profile View All Posts By User U2U Member
tigra
Administrator

Posts: 2049
Registered: 6/17/2002
Location: US, CO
Member Is Offline
posted on 12/11/2006 at 08:26 PM Reply With Quote

The text moves down 1 pixel when you hover the root level because you specified different margins for the normal and mouseover states in the CSS file:

Code:
.m0l0iout {
font-family: Arial;
font-size: 12px;
text-decoration: none;
margin: 4px 0 0 8px; /* <-- 4 pixels top margin in normal state */
color: #046F5B;
}
.m0l0iover {
font-family: Arial;
font-size: 12px;
text-decoration: underline;
margin: 5px 0 0 8px; /* <-- 5 pixels top margin in hover state */
color: #046F5B;
}
View User's Profile View All Posts By User U2U Member
Post new thread

Related Links:
Product Page Tigra Menu
Product Demonstrations Live Demos:
Traditional Blue
White Steps
Inner HTML
All Together
Frames Targeting
Free Download Free Download
Free Download Menu Builders
Online Builder
Builder for Windows
Product Documentation Documentation:
Documenation Page
Change Log
Menus Comparison Table
Support Forum Support Forum
 

Go To Top


Powered by XMB 1.9.1 Nexus
Developed By Aventure Media & The XMB Group © 2002-2004