Code

Discussion on Sky Mega Menu

Discussion on Sky Mega Menu

By
Cart 1,991 sales

voky supports this item

Supported

This author's response time can be up to 2 business days.

166 comments found.

hello i have huge problem with instalation. I cannot instal this plugin there is an error all the time when i try :( You have any idea whah should i do with this?

Hello. Unfortunately it’s not a WP plugin.

Regards, Voky

Hello, there is a possiblity to close the mobile menu? i have it like this :

“sky-mega-menu sky-mega-menu-fixed sky-mega-menu-response-to-switcher “

But i saw in the css that the .switcher is disappearing after the click (display: none;).

I want a solution that the Home Button will stay after the click. When you press it again it should close. I think that has to be fixed. Cause when i open the menu i can only scroll the website with the menu open.

I think now problem solved.

thanks! working perfect

Great!

I need a menu plugin that will let me use my own icons AND let me use a grid to manage many sub menu items – will yours do both? Thank you

Hello. It’s possible to add a small css modification and use images as icons instead of Font Awesome. As for the grid, you can check this demo. It shows different grid options.

Regards, Voky

I had a question regarding the alignment of the drop down menus.

I have one of my menu’s floating to the right side of the navigation bar. As a result, the drop down menus are flying out to the RIGHT>> side and are going off of the screen. I needed that one menu to fly out to the LEFT<< so the drop downs remain inside the website container.

Here is an example of what I mean: http://image.prntscr.com/image/44457f6605e34263b1859ff9ededb479.png

I have spent the last little while trying to figure this out, but I cannot find a proper solution. Any help would be greatly appreciated!

Hello. Sorry for the delay. Here is an example of right alignment http://voky.com.ua/showcase/sky-mega-menu/examples/demo-personal.html

Regards, Voky

Nice product, but I have some problems, when using mobile browsers(chrome-firefox-safari). The drop-down menu’s seem to stick and don’t disappear when you no longer hover over the top level menu item. The only way to make them menu items disappear is to click on the menu bar or on the page if there is available area to click. I tested both samsung note2 and iphone 5s. Also some menu items does not available when clicked, only 8-9 opened menu items are visible on mobile browsers.

Hello. You need to set a real links instead of ”#”, so on click you will be redirected to the other page. Right now it’s ”#” for the demo purposes, so when you click on it nothing happens.

Regards, Voky

I used onclick events for ajax request

A TIP – if your doing Device dependent CSS for Sky Menus, the MAX screen size is set at 1,000px Wide. This resulted in some weird Screen errors due to the max width being set to a 1,000px wide on both SD and HD Screen sizes ie 1980×1080 and 2400px.

Best to Change the max-width to 3000px

Hello. Max width is set only of demo purposes in the demo.css file. And on real project you don’t need to include that file, so you can use any width of the menu that you want.

Regards, Voky

Yeap, but I wasn’t aware of that – so it was causing issues, suggest you remove it from the download version. As I lived without it working for some time, until I worked out why I wasn’t getting the right results.

the CSS switch I used to make active menu buttons into inactive URLS works great! As said this was a surprise being able to do virtual switches using CSS and screen sizes. A Happy accident :-)

I can’t remove this, because when client downloads the pack he wants to see exactly the same result as the demo. But in the documentation there is an information, that you need to include only sky-mega-menu.css file without demo.css.

Regards, Voky

Hi Voky, been a year since I last needed help – works fine. Until you do something different…

I have given a URL to the main buttons – say About Us with a

<li aria-haspopup="true" class="L114"> <a href="/about" target="_self" rel="next"><i class="fa fa-database" />About Us</a> <div class="grid-container3"> rather than:: <code><a href="#" target="_self" rel="next"><i class="fa fa-database" /></a></code> This Works GREAT in a Desktop site, but at the moment, I am redeveloping for a Mobile site... NOW I have just found the problem, as the Mob version needs to have NO URL on the main buttons, so hence the "#" Otherwise you fire up the URL on a touchscreen - Sorry I missed this one as originally developed for Tablets, and it didn't matter or I just missed it. Is there any way of enabling or disabling URLS on the Main Button when in Mobile screen sizes??? Without the need for complex JS, kind of thinking using Display: None and Block in CSS related to the SCREEN sizes... Creating a simple on/off switch Any thoughts? There will be other questions as I am currently debugging my updated CSS, from your original to be mobile friendly... Like yours was, before I adding things ;-( (my oversight) </div></li>

Voky – just so you know, my stupidly daft SCREEN size CSS on/off switch for URLS works EXCELLENTLY!!! Surprised on Block level it does it, but it does. Simple and it works.

So you can have LIVE URLS on a desktop, and just # on mobile sized screens. Just by using CSS.

There’s a first, an alternative to writing JS scripts, or complex PHP.

Hi Voky, this menu looks amazing! Pre-purchase problem: I’m looking for the vertically align left hand sided menu. I’m adding some content in the demo using my browser but it doesn’t look fine. The new element is in the bottom rather than on the right side. I tried to modify some display, float etc, without success and loosing responsiveness. My question is, is there a way to make it work? Will you release a new version to solve this? Thanks

Oh. Yeah, for the content you need to create a container.

Regards, Voky

Ok, I think I will need an example if you have some available, because all the tests I made, it looses the responsiveness. One more thing, can you send me your bank account over the email and I can transfer you the money directly for the purchase (if you are in the EU)? I have some problems with my credit card and no Paypal :S. Regards

Hello. No, you can by this product only thought Codecanyon.

Regards, Voky

OMG! Can I write that? I just bought this and in literally less than 20 minutes I am up and running. It is super easy to configure and understand.

Thanks Voky! This is one of the easiest (and powerful / flexible) items I have bought off Code Canyon.

Happy with the responsiveness. I bought another CSS menu item before this, and the documentation is not as good, nor is it as responsive as it claims. Sky Menu on the other hand is awesome!

The Font Awesome is very cool. Future wishlist item – color icons please!

Oh, forgot about the path ) But anyway i’m glad that problem solved!

Regards, Voky

Voky,

Is it possible to display regular ICO files somehow? While Font Awesome has a lot, there are certain categories sorely missing. I wonder how difficult it is to custom add images to Font Awesome….

By the way, I’m beginning to implement your Sky Tabs too…works well!

Hello. Yeah, it’s possible. Please send me a support email and i’ll show you an example.

Regards, Voky

Hi, my menu has all top level links. When a menu item is clicked and the page loads, will the selected menu item be highlighted as we are on that page?

Hello. You need to set a special class for menu item that you want yo be highlighted.

Regards, Voky

hello is it possible to use your megamenu on shopify ?

Hello. Yes, i think it’s possible, but you need to integrate it manually.

Regards, Voky

Is there a way to have it horizontal on desktop view but then switch to vertical when on mobile?

I want to remove the icons and use just text but when it gets on mobile all that shows up are the icons. Since the text is too small to fit horizontally on mobile it makes sense for it to switch vertically to text when using mobile automatically. Let me know if this is possible! Thanks.

Hi, Have sent a couple of emails for support but have not gotten a response. The first was probably 10 days ago and the last close to a week.

How can I get some help?

Hello.

Thanks for the message. Right now finishing an update and will also fix this problem in it.

Regards, Voky

Okay, thank you.

Is the android issue included in the same update or was that related only to me?

One last thing. Does the new update include the newest version of font awesome?

That’s all will watch for the update. Great work. I know where to come for another site when the business owner decides to update.

Thank You

Yeah, mobile version fix is the most important thing in this update.

Sure, font awesome will be updated to the latest version.

Regards, Voky

I have a presale question.

Is it possible to view the submenu of the page where you are. soo If you come to my website, I want you immediately see all the submenus of the page, in most cases the homepage

An example can be seen on www.dagaanbiedingen.nl

Hello. No, unfortunately it’s impossible without javascript.

Regards, Voky

Hi, There is a problem with dropdown icons in FireFox. See here http://i.imgur.com/yjCAJFy.png

Hello. Thanks for your message! Will fix this asap.

Regards, Voky

Hi!

First of all thank you for excellent product! Can you advice me how to set adjust / remove transparency on nested menus?

Br, Petteri

Hello, thanks! Yeah, sure i’ll help you. Just send me a support message and i’ll show you how to do this.

Regards, Voky

Hi, is it possible to use this menu in a header that contains a logo to the left and the menu to the right, typical of most WordPress themes for example? Thanks

Thanks Voky, I will send you a support email

Thans for your fast and friendly help Voky, much appreciated

No problem! Alway glad to help ;)

Regards, Voky

I found a little bug with your code.

Just check your mobile-switcher.html example file and make “about” section aligned to right. Add class=”right” and it will float at the right with “Contacts” section. This works as expected. But when you resize window to mobile size something wrong happens with “About Us -> Our Team -> Markus Fisher or any other name”. Submenu displays at the left side of the screen and it is impossible to click it. It is also clipped.

When you do not set class=”right” everything is ok.

Hi voky! Any progress so far?

Hello. Yeah, almost done. One more problem came up, so I’m fixing it and will update files in few days.

Regards, Voky

Hello Voky. Sorry for bothering you. Any progres with new version of your great project?

Very nice piece of code. I also bought your other products. Very high code quality.

It is very good idea to call your inner css classes with unique names such as sky-mega-menu, sky-mega-menu-anim-scale or sky-mega-menu-response-to-switcher. Some code purist may want to change it for shorter version so I think it would be a nice idea to make some aliases in upcoming versions i.e. sky-mega-menu as sky-mm.

There is only one class name that you use unchanged. It is ”.right”. I advise to change it i.e. to “sky-mm-right” beacuse this is the only way your code will not interfere with bootstrap or zurb foundation. They use ”.right” class with !important rules so users that use those systems may have some problems with your menu.

The solution is to change all ”.right” class names in css file to ”.something-unique” and use that class in mega menu code.

But this is just a minor issue:)

Once again – great piece of code.

Hello! Thanks a lot! I really glad that you liked my product. And i think you are totally right. I’ll change the “right” class name to something different, so there will be no css conflict.

Regards, Voky

:) If I may suggest another change:) You use .grid-columnXX class. Unfortunatelly Zurb Foundation uses class*=”column” directive which overrides your code and some strange and horrible things happen when I use this framework:P It overrides menu level2+ so it becames broken. I did not check bootstrap, but they may have similiar problem.

I had to change .grid-columnXX to .grid-colXX and now everything works smoothly.

Unfortunatelly sometimes it is not ok to use some popular words in code:)

Hello, what is the right way to dismiss the menu when user clicks on the link. I think it’s annoying the menu stays there after the click.

Regards, Elgs

Hello. Sorry, but I’m not quite understand what you mean. After user clicks on the menu item he must be transferred on another page. In demos there is no links, just ”#” for demo purposes. But on real websites there must be a links.

Regards, Voky

Thanks for the reply, Voky. I see what you meant. It makes sense if the link is an anchor to another webpage. However, I’m working with an Angular project, the link in Angular is technically to trigger some javascript code as oppose to transferring to another page. I understand the Sky Mega Menu is written purely in CSS. But I was trying to see the opportunity to write some javascript to 1) locate the dom, say ’.grid-container3’, 2), hide it using javascript. But I’m not quite sure how to use javascript to mimic the mouse leave (un-hover) event?

Thanks, Elgs

Hello. I think i have a solution for you, but can you please send me a email with a link to your project.

Regards, Voky

by
by
by
by
by
by

Tell us what you think!

We'd like to ask you a few questions to help improve CodeCanyon.

Sure, take me to the survey