Author Topic: Mega Menu  (Read 24316 times)

Offline nibz

  • Posts: 684
  • Gender: Male
Mega Menu
« on: June 20, 2011, 11:34:46 PM »
In the forum i see many people asking for a Mega Menu,
I don't know if someone already had a solution,

Check my website for info, a demo and download a simple demo template:
http://nibz.nl/template/mega-menu/

Credits go to: http://www.designchemical.com/lab/jquery-mega-drop-down-menu-plugin/getting-started/ for his script.
Questions and comments are welcome.

Greets Robin
« Last Edit: July 19, 2013, 03:26:51 PM by nibz »

Offline Hans

  • Posts: 914
  • Gender: Male
Re: Mega Menu
« Reply #1 on: June 20, 2011, 11:45:07 PM »
Thanks Robin. Great!
Hans
Hans - Nijmegen - The Netherlands

Offline nibz

  • Posts: 684
  • Gender: Male
Re: Mega Menu
« Reply #2 on: June 21, 2011, 12:07:54 AM »
You're welcome :)

Offline Vincent

  • Posts: 376
  • Gender: Male
    • websites voor ondernemers
Re: Mega Menu
« Reply #3 on: June 21, 2011, 09:59:27 PM »
Very nice, thanks for sharing!

Offline Argos

  • Posts: 2542
  • Gender: Male
    • Argos Media
Re: Mega Menu
« Reply #4 on: June 24, 2011, 03:58:25 PM »
Cool! I used the script once on a site with manual menu, but never took the time to figure it out using WB showmenu2. Thanks for sharing!
Jurgen Nijhuis
Argos Media
Heiloo, The Netherlands
----------------------------------------------------------------
Please don't request personal support, use the forums!

Offline Roych

  • Betatester
  • **
  • Posts: 573
  • Gender: Male
Mega Menu Chrome problem?
« Reply #5 on: June 26, 2011, 03:36:50 PM »
Great menu ;)

Hi Im having a problem seeing this menu in Google Chrome. Everything is working fine in Firefox and IE but in chrome only works on some computers. I can see the drop down menu at my PC at work, but I can't see the drop down at my home PC.

Any idea?

Thanx, R.

Offline nibz

  • Posts: 684
  • Gender: Male
Re: Mega Menu
« Reply #6 on: June 26, 2011, 05:39:37 PM »
Can have something to do with that the javascript isn't set ON in the specific browser.

At school i can see it on 1 computer but not on the other... (JS thing)..

But don't know..

Offline kweitzel

  • WebsiteBaker Org e.V.
  • **
  • Posts: 6983
  • Gender: Male
Re: Mega Menu
« Reply #7 on: June 27, 2011, 10:35:05 AM »
Offtopics have been deleted by me!

cheers

Klaus

Offline pcwacht

  • Posts: 2923
  • Gender: Male
    • Dutch ICT info
Re: Mega Menu
« Reply #8 on: June 27, 2011, 12:28:29 PM »
hmmm, there was a very good link here yesterday,
and there where megamenues as well. Though named differently.

Shame it is deleted. I hope my yesterdays cahce will know it.

John
http://www.ictwacht.nl = Dutch ICT info
http://www.pcwacht.nl = My first
both still work in progress, since years.....

Offline Argos

  • Posts: 2542
  • Gender: Male
    • Argos Media
Re: Mega Menu
« Reply #9 on: June 27, 2011, 12:39:51 PM »
hmmm, there was a very good link here yesterday,
and there where megamenues as well. Though named differently.

Shame it is deleted. I hope my yesterdays cahce will know it.

John

OK, but let's not discuss other menus than mega menus here. It's nice to keep the topic focused.
http://www.cssplay.co.uk/menus/
The one was the Superfish jQuery with SM2 (can't find the link right now)

There are also several mega menus at CodeCanyon, for example http://codecanyon.net/item/mega-menu-complete-set/152825
« Last Edit: June 27, 2011, 12:45:53 PM by Argos »
Jurgen Nijhuis
Argos Media
Heiloo, The Netherlands
----------------------------------------------------------------
Please don't request personal support, use the forums!

Offline jdjdjd

  • Posts: 39
Re: Mega Menu
« Reply #10 on: September 19, 2012, 05:38:06 PM »
Hi all, I know this is an old thread, but I've played around with the script, stripping out the wordpress content and using the code nibz kindly provided but can't for the life of me get it to work.

Any ideas, or are there other solutions out there now?
« Last Edit: September 19, 2012, 05:50:46 PM by jdjdjd »

Offline nibz

  • Posts: 684
  • Gender: Male
Re: Mega Menu
« Reply #11 on: September 19, 2012, 05:54:59 PM »
Hi jdjdjd do you have a demo of the page where you can't get it to work ?

I can provide a "bare" template with only the menu and a wrapper (for example purpose if you like),

Gr. Nibz
« Last Edit: October 02, 2013, 08:04:11 PM by nibz »

Offline jdjdjd

  • Posts: 39
Re: Mega Menu
« Reply #12 on: September 20, 2012, 10:19:57 AM »
Hi Nibz,

Great work with your demo. I deleted my test site yesterday after much frustration, I always have more luck leaving something for an evening then coming back to it to try again, but to be honest I think porting the script is beyond my abilities right now.

If you could share your template that would be great. I started to consider using wordpress with the abundance of plugins for it inc. mega menu's, but I've used website baker on over 30 sites and the clients love it!

Offline nibz

  • Posts: 684
  • Gender: Male
Re: Mega Menu
« Reply #13 on: September 20, 2012, 11:46:27 AM »
Here is the code,

I know it has one error with firebug, but it works, i will have a look into that mater later today :)
But this is just to get you started, hope it helps

Gr. Nibz

[removed attatchment see my first post in this topic!]
« Last Edit: July 19, 2013, 03:23:58 PM by nibz »

Offline jdjdjd

  • Posts: 39
Re: Mega Menu
« Reply #14 on: September 21, 2012, 10:28:13 AM »
Just to say thanks again on your great work Nibz - I think for people wanting drop-down menu's this is the way to go over the other website baker alternatives - it's very easily customisable too.

Offline nibz

  • Posts: 684
  • Gender: Male
Re: Mega Menu
« Reply #15 on: September 21, 2012, 11:19:22 AM »
jdjdjd I completely agree!

The props for the script go to designchemical,
I only ported it to WB :), but it is really the way to go for a nice mega menu with many nice options :)

Thinking of creating a little demo site with some info's (when i have time :) )


Offline nibz

  • Posts: 684
  • Gender: Male
Re: Mega Menu
« Reply #16 on: July 19, 2013, 04:00:44 PM »
Just released a renewed demo template; a megamenu for WebsiteBaker!

Demo and download: http://nibz.nl/template/mega-menu/

Megamenu screenshot (color: white)

Offline Argos

  • Posts: 2542
  • Gender: Male
    • Argos Media
Re: Mega Menu
« Reply #17 on: July 19, 2013, 04:04:37 PM »
Very cool!! I notice it's not responsive (or your demosite isn't...). Can it be made responsive? Nowadays almost all new sites have to be responsive.
Jurgen Nijhuis
Argos Media
Heiloo, The Netherlands
----------------------------------------------------------------
Please don't request personal support, use the forums!

Offline nibz

  • Posts: 684
  • Gender: Male
Re: Mega Menu
« Reply #18 on: July 19, 2013, 04:42:45 PM »
It's not responsive, but i can make it responsive.
Will do so in the next version.

Offline nibz

  • Posts: 684
  • Gender: Male
Re: Mega Menu
« Reply #19 on: July 19, 2013, 05:20:18 PM »
Updated the download file.
Made the menu responsive, just a simple select menu shows on small screens.

Download: http://nibz.nl/template/mega-menu/
Demo: http://nibz.nl/template/mega-menu/demo/
« Last Edit: July 19, 2013, 05:25:33 PM by nibz »

Offline Argos

  • Posts: 2542
  • Gender: Male
    • Argos Media
Re: Mega Menu
« Reply #20 on: July 19, 2013, 07:09:40 PM »
Hi,

hm, it also shows on regular screens  :|
But I was thinking more along the lines of adapting widths and font-sizes, before finally changing into a dropdown menu.
Jurgen Nijhuis
Argos Media
Heiloo, The Netherlands
----------------------------------------------------------------
Please don't request personal support, use the forums!

Offline nibz

  • Posts: 684
  • Gender: Male
Re: Mega Menu
« Reply #21 on: July 19, 2013, 07:28:53 PM »
Hi,

hm, it also shows on regular screens  :|
But I was thinking more along the lines of adapting widths and font-sizes, before finally changing into a dropdown menu.

The mobile menu in my example shows when the screen is smaller than 960px, you can adapt it to the width of your choice.
The template is just a demo, but i will take a look if i can adapt the css to be more responsive (adapting the widths and font sizes) but this will take a while, when it's ready i will post again (thank after the holidays).

Gr. Robin

Offline Argos

  • Posts: 2542
  • Gender: Male
    • Argos Media
Re: Mega Menu
« Reply #22 on: July 20, 2013, 02:21:49 AM »
Ah, now the dropdown is gone from thh regular screen. Maybe it was a cache thing in my browser or something. It could use some visual polishing, but it's a nice addition!
Jurgen Nijhuis
Argos Media
Heiloo, The Netherlands
----------------------------------------------------------------
Please don't request personal support, use the forums!

Offline nibz

  • Posts: 684
  • Gender: Male
Re: Mega Menu
« Reply #23 on: July 20, 2013, 10:22:10 PM »
Ah, now the dropdown is gone from thh regular screen. Maybe it was a cache thing in my browser or something. It could use some visual polishing, but it's a nice addition!

@Argos added some visual polishing ;), i think i can't make it more responsive because i don't know how many menu items every menu has and which setting you want to set, so this will be the definitive version (for now) regarding the responsiveness.

Screenshot: (white responsive)


And again:
Download: http://nibz.nl/template/mega-menu/
Demo: http://nibz.nl/template/mega-menu/demo/

More suggestions are welcome :)
« Last Edit: July 20, 2013, 10:33:23 PM by nibz »

Offline Argos

  • Posts: 2542
  • Gender: Male
    • Argos Media
Re: Mega Menu
« Reply #24 on: July 22, 2013, 04:11:49 PM »
Looking great nibz! Much better  :-D

One thing: you have to click the text to show the dropdown. It would be better if the complete dropdown would be clickable.
Jurgen Nijhuis
Argos Media
Heiloo, The Netherlands
----------------------------------------------------------------
Please don't request personal support, use the forums!