Pure CSS Mega Menu

[Robbyn7]

Sorry, it is now out of maintenance mode. You should be able to view it now.

Thanks.

[picaflor-azul]

Sorry, it is now out of maintenance mode. You should be able to view it now.

Thanks.

In the includes/templates/oxford_dark/common/tpl_mega_menu.php file remove the right from <li class="customer_service right">

Then in your stylesheet.css file change the #navMainSearch to:

#navMainSearch {
    float: right;
     position: relative;
    top: 240px;
    z-index: 99999;
}

Thanks,

Anne

[icecold]

i am working on my demo site now and attempted to do a few css changes to get my multiple column megamenu to be properly displayed, however, I tried a few tricks I found here, and one of my own, and mine does succeed in creating columns but it messes up the whole thing below is my demo site

http://www.theoutletseason.com/demostore 

I added a new class and then also modified the tpl_megamenu, but I am missing something here ...

[Robbyn7]

PERFECT Anne! Thank You and sorry for the confusion.

[gjh42]

icecold - Add to your stylesheet_mega_menu.css

.submenu:hover>.level3 {background: #aabbcc; z-index: 101;}

Adjust the aabbcc to suit.

[picaflor-azul]

PERFECT Anne! Thank You and sorry for the confusion.

I am happy that it worked ;)

Thanks,

Anne

[bn17311]

hi,
i have added my main categories to header but the accessories menu has some subs which all ways show, how do i hide these until someone hovers over them

http://www(dot)onyour(dot)bike/

thanks
bryan

[marypotter]

I can't seem to get this to work on my page.

I wonder if it's because I'm using a template I bought?

dasterisk.com/theglobe

I added the files to the proper directory and added the code to the end of the tpl_header.php right before the last <?php } ?>

<!--bof-mega menu display--> 
<?php require($template->get_template_dir('tpl_mega_menu.php',DIR_WS_TEMPLATE, $current_page_base,'common'). '/tpl_mega_menu.php');?> 
<!--eof-mega menu display--> 
<div class="clearBoth"></div>

I made all the changes in the admin settings and turned off the header category tabs.

When I load the page in Chrome I get the following errors, but I don't think any of them have to do with what I'm doing wrong in the menu:

carouFredSel: Set a height for the items!
carouFredSel: No element found for "#sidebox_slider".
carouFredSel: No element found for "#carousel".
carouFredSel: No element found for "#images".
Invalid App Id: Must be a number or numeric string representing the application id.
FB.getLoginStatus() called before calling FB.init().
Uncaught SecurityError: Blocked a frame with origin "http://static.ak.facebook.com" from accessing a frame with origin "http://dasterisk.com". Protocols, domains, and ports must match.
Uncaught SecurityError: Blocked a frame with origin "https://s-static.ak.facebook.com" from accessing a frame with origin "http://dasterisk.com". The frame requesting access has a protocol of "https", the frame being accessed has a protocol of "http". Protocols must match.
Uncaught SecurityError: Blocked a frame with origin "https://www.facebook.com" from accessing a frame with origin "http://dasterisk.com". The frame requesting access has a protocol of "https", the frame being accessed has a protocol of "http". Protocols must match.

[picaflor-azul]

I can't seem to get this to work on my page.

I wonder if it's because I'm using a template I bought?

dasterisk.com/theglobe

I added the files to the proper directory and added the code to the end of the tpl_header.php right before the last <?php } ?>

<!--bof-mega menu display--> 
<?php require($template->get_template_dir('tpl_mega_menu.php',DIR_WS_TEMPLATE, $current_page_base,'common'). '/tpl_mega_menu.php');?> 
<!--eof-mega menu display--> 
<div class="clearBoth"></div>

I made all the changes in the admin settings and turned off the header category tabs.

When I load the page in Chrome I get the following errors, but I don't think any of them have to do with what I'm doing wrong in the menu:

carouFredSel: Set a height for the items!
carouFredSel: No element found for "#sidebox_slider".
carouFredSel: No element found for "#carousel".
carouFredSel: No element found for "#images".
Invalid App Id: Must be a number or numeric string representing the application id.
FB.getLoginStatus() called before calling FB.init().
Uncaught SecurityError: Blocked a frame with origin "http://static.ak.facebook.com" from accessing a frame with origin "http://dasterisk.com". Protocols, domains, and ports must match.
Uncaught SecurityError: Blocked a frame with origin "https://s-static.ak.facebook.com" from accessing a frame with origin "http://dasterisk.com". The frame requesting access has a protocol of "https", the frame being accessed has a protocol of "http". Protocols must match.
Uncaught SecurityError: Blocked a frame with origin "https://www.facebook.com" from accessing a frame with origin "http://dasterisk.com". The frame requesting access has a protocol of "https", the frame being accessed has a protocol of "http". Protocols must match.

I would recommend contacting the author of the template to see if their coding is causing the problem. Just fyi, the pure css mega menu is not responsive.

Thanks,

Anne