Support » Themes and Templates » Dropdown menu dissappearing when scrolled over

  • I’m relatively new to WordPress and HTML coding but have a small amount of experience. Recently I’ve been working on our website ( Today I noticed that the dropdown menu on some pages will disappear when you scroll the cursor down onto a link. This doesn’t happen all the time and doesn’t appear to be happening when you are on the main page of the website. If you scroll the cursor into a “sweet spot” you can get the menu to stay but you have to get the right speed and placement for this to work. When you hit the “sweet spot” the dropdown menu will disappear and then appear again and allow you to access the entire dropdown menu. I’ve tried searching for a solution and though there are a couple of answer there doesn’t seem to be any that fit my stylesheet. The theme I’m using is called Epione and I haven’t been able to find any support for this specific theme.

    Recently I changed several of the font-family designations on the site in my stylesheet. Currently I have

    font-family:Calibri, Tahoma, Arial

    I’ve tried restoring the original


    but the problem persists.

    Here is the entire coding for my menu and submenu sections. The submenus are the dropdowns and that’s where I’m having my issues:

    #menu{ margin-top:12px; width:960px; height:50px;background:url(images/menubg1.png) no-repeat; float:left; }
    .topmenu ul{ float:left; margin-top:14px; padding-left:10px; margin-left:0; z-index:999; position:center;}
    .topmenu ul li{ list-style-type:none; float:left; }
    .topmenu ul li a{ text-decoration:none; margin:0 11px; font-family: ‘Calibri’, ‘Tahoma’, ‘Arial’; color:#fff; font-size:18px; text-transform:normal; text-shadow:0 0 0px #000; display:block; height:20px; }

    .topmenu ul li ul.sub-menu, .topmenu ul li ul.children { position:absolute; z-index:8888; margin:0; padding:5px 0px 20px 0px; width:159px; background: url(images/sub-menu_top1.png); background-position: top; background-repeat:no-repeat;}
    .sub-menu-bottom{ background: url(images/sub-menu_bottom1.png) no-repeat; width:159px; height:20px; float:left;}
    .topmenu ul li ul.sub-menu li, .topmenu ul li ul.children li{ float:none; background:url(images/sub-menu_bg1.png) repeat-y;}
    .topmenu ul li ul.sub-menu li a, .topmenu ul li ul.children li a{ display:block; width:133px; background:url(images/sub-menu_border1.png) bottom repeat-x; padding:4px 0px; font-family:Calibri, Tahoma, Arial; color:#fff; font-style:normal; font-size:12px; height:auto;}
    .topmenu ul li ul.sub-menu li ul.sub-menu, .topmenu ul li ul.children li ul.children{ margin:0px; float:left; position:relative; background:none; padding:0px;}
    .topmenu ul li ul.sub-menu li ul.sub-menu li, .topmenu ul li ul.children li ul.children li{}
    .topmenu ul li ul.sub-menu li ul.sub-menu li a, .topmenu ul li ul.children li ul.children li a{ padding-left:7px; font-size:11px; color:#01C2D1;width:128px;}
    /*MENU END*/

    Any help would be greatly appreciated.

  • The topic ‘Dropdown menu dissappearing when scrolled over’ is closed to new replies.