Hallo,
ich hab mit Firework ein kleines PopUp-Menü erstellt.
Allerdings ist das Ergebniss nicht ganz so toll.
Und zwar: Wenn ich einen der Menüpunkte welcher Unterpunkte erhält verlasse (also MouseOut) dauert es etwa eine Sekunde bis auch das Untermemü wieder verschwindet...
Schaut euch bitte mal dieses Menü an, insbesondere den Menüpunkt "Produkte":
Beispiel
Als Ausgabe erhaöte ich eine JS und ein CSS File:
JS:
CSS:
Kennt sich einer von euch aus und könnte mir Rat geben :)
vg
ich hab mit Firework ein kleines PopUp-Menü erstellt.
Allerdings ist das Ergebniss nicht ganz so toll.
Und zwar: Wenn ich einen der Menüpunkte welcher Unterpunkte erhält verlasse (also MouseOut) dauert es etwa eine Sekunde bis auch das Untermemü wieder verschwindet...
Schaut euch bitte mal dieses Menü an, insbesondere den Menüpunkt "Produkte":
Beispiel
Als Ausgabe erhaöte ich eine JS und ein CSS File:
JS:
Code:
var mmOpenContainer = null;
var mmOpenMenus = null;
var mmHideMenuTimer = null;
function MM_menuStartTimeout(hideTimeout) {
mmHideMenuTimer = setTimeout("MM_menuHideMenus()", hideTimeout);
}
function MM_menuHideMenus() {
MM_menuResetTimeout();
if(mmOpenContainer) {
var c = document.getElementById(mmOpenContainer);
c.style.visibility = "inherit";
mmOpenContainer = null;
}
if( mmOpenMenus ) {
for(var i = 0; i < mmOpenMenus.length ; i++) {
var m = document.getElementById(mmOpenMenus[i]);
m.style.visibility = "hidden";
}
mmOpenMenus = null;
}
}
function MM_menuHideSubmenus(menuName) {
if( mmOpenMenus ) {
var h = false;
var c = 0;
for(var i = 0; i < mmOpenMenus.length ; i++) {
if( h ) {
var m = document.getElementById(mmOpenMenus[i]);
m.style.visibility = "hidden";
} else if( mmOpenMenus[i] == menuName ) {
h = true;
} else {
c++;
}
}
mmOpenMenus.length = c+1;
}
}
function MM_menuOverMenuItem(menuName, subMenuSuffix) {
MM_menuResetTimeout();
MM_menuHideSubmenus(menuName);
if( subMenuSuffix ) {
var subMenuName = "" + menuName + "_" + subMenuSuffix;
MM_menuShowSubMenu(subMenuName);
}
}
function MM_menuShowSubMenu(subMenuName) {
MM_menuResetTimeout();
var e = document.getElementById(subMenuName);
e.style.visibility = "inherit";
if( !mmOpenMenus ) {
mmOpenMenus = new Array;
}
mmOpenMenus[mmOpenMenus.length] = "" + subMenuName;
}
function MM_menuResetTimeout() {
if (mmHideMenuTimer) clearTimeout(mmHideMenuTimer);
mmHideMenuTimer = null;
}
function MM_menuShowMenu(containName, menuName, xOffset, yOffset, triggerName) {
MM_menuHideMenus();
MM_menuResetTimeout();
MM_menuShowMenuContainer(containName, xOffset, yOffset, triggerName);
MM_menuShowSubMenu(menuName);
}
function MM_menuShowMenuContainer(containName, x, y, triggerName) {
var c = document.getElementById(containName);
var s = c.style;
s.visibility = "inherit";
mmOpenContainer = "" + containName;
}
CSS:
Code:
td img {
/* Another Mozilla/Netscape bug with making sure our images display correctly */
display: block;
}
#FWTableContainer910931448 {
/* The master div to make sure that our popup menus get aligned correctly. Be careful when playing with this one. */
position:relative;
margin:0px;
width:700px;
height:40px;
text-align:left;
}
#MMMenuContainer1016182649_0 {
/* This ID is related to the master menu div for menu MMMenuContainer1016182649_0 and contains the important positioning information for the menu as a whole */
position:absolute;
left:200px;
top:40px;
visibility:hidden;
z-index:300;
}
#MMMenu1016182649_0 {
/* This class defines things about menu MMMenu1016182649_0's div. */
position:absolute;
left:0px;
top:0px;
visibility:hidden;
background-color:#999999;
border:0px solid #999999;
width:150px;
height:44px;
}
.MMMIFVStyleMMMenu1016182649_0 {
/* This class determines the general characteristics of the menu items in menu MMMenu1016182649_0 */
border-top:0px solid #000000;
border-left:0px solid #000000;
border-bottom:0px solid #999999;
border-right:0px solid #999999;
width:150px;
height:22px;
voice-family: "\"}\"";
voice-family:inherit;
width:144px;
height:16px;
}
.MMMIVStyleMMMenu1016182649_0 {
/* This class determines the general characteristics of the menu items in menu MMMenu1016182649_0 */
border-top:0px;
border-left:0px solid #000000;
border-bottom:0px solid #999999;
border-right:0px solid #999999;
width:150px;
height:22px;
voice-family: "\"}\"";
voice-family:inherit;
width:144px;
height:16px;
}
#MMMenu1016182649_0_Item_0 {
/* Unique ID for item 0 of menu MMMenu1016182649_0 so we can set its position */
left:0px;
top:0px;
}
#MMMenu1016182649_0_Item_1 {
/* Unique ID for item 1 of menu MMMenu1016182649_0 so we can set its position */
left:0px;
top:22px;
}
#MMMenu1016182649_0_1 {
/* This class defines things about menu MMMenu1016182649_0_1's div. */
position:absolute;
left:150px;
top:0px;
visibility:hidden;
background-color:#999999;
border:0px solid #999999;
width:150px;
height:22px;
}
.MMMIFVStyleMMMenu1016182649_0_1 {
/* This class determines the general characteristics of the menu items in menu MMMenu1016182649_0_1 */
border-top:0px solid #000000;
border-left:0px solid #000000;
border-bottom:0px solid #999999;
border-right:0px solid #999999;
width:150px;
height:22px;
voice-family: "\"}\"";
voice-family:inherit;
width:144px;
height:16px;
}
#MMMenu1016182649_0_1_Item_0 {
/* Unique ID for item 0 of menu MMMenu1016182649_0_1 so we can set its position */
left:0px;
top:0px;
}
#MMMenu1016182649_0_2 {
/* This class defines things about menu MMMenu1016182649_0_2's div. */
position:absolute;
left:150px;
top:22px;
visibility:hidden;
background-color:#999999;
border:0px solid #999999;
width:150px;
height:44px;
}
.MMMIFVStyleMMMenu1016182649_0_2 {
/* This class determines the general characteristics of the menu items in menu MMMenu1016182649_0_2 */
border-top:0px solid #000000;
border-left:0px solid #000000;
border-bottom:0px solid #999999;
border-right:0px solid #999999;
width:150px;
height:22px;
voice-family: "\"}\"";
voice-family:inherit;
width:144px;
height:16px;
}
.MMMIVStyleMMMenu1016182649_0_2 {
/* This class determines the general characteristics of the menu items in menu MMMenu1016182649_0_2 */
border-top:0px;
border-left:0px solid #000000;
border-bottom:0px solid #999999;
border-right:0px solid #999999;
width:150px;
height:22px;
voice-family: "\"}\"";
voice-family:inherit;
width:144px;
height:16px;
}
#MMMenu1016182649_0_2_Item_0 {
/* Unique ID for item 0 of menu MMMenu1016182649_0_2 so we can set its position */
left:0px;
top:0px;
}
#MMMenu1016182649_0_2_Item_1 {
/* Unique ID for item 1 of menu MMMenu1016182649_0_2 so we can set its position */
left:0px;
top:22px;
}
.MMMenuItemSpanMMMenu1016182649_0 {
/* The span class definition so we can make sure that arrows and menu text in menu MMMenu1016182649_0 look correct */
float:left;
width:135px;
}
.MMArrowStyleMMMenu1016182649_0 {
/* This class allows us to position the submenu arrows for menu MMMenu1016182649_0 */
position:absolute;
left:136px;
top:7px;
}
#MMMenuContainer1016182649_0 img {
/* needed for Mozilla/Camino/Netscape */
border:0px;
}
#MMMenuContainer1016182649_0 a {
/* Controls the general apperance for menu MMMenuContainer1016182649_0's items, including color and font */
text-decoration:none;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#000000;
text-align:left;
vertical-align:middle;
padding:3px;
background-color:#cccccc;
font-weight:normal;
font-style:normal;
display:block;
position:absolute;
}
#MMMenuContainer1016182649_0 a:hover {
/* Controls the mouse over effects for menu MMMenuContainer1016182649_0 */
color:#ffffff;
background-color:#ff0000;
}
Kennt sich einer von euch aus und könnte mir Rat geben :)
vg