Solved

Zurb Foundation 5 - Menu Issue

Posted on 2014-01-20
5
832 Views
Last Modified: 2014-01-30
I've built my site using the Zurb Foundation 5 framework and have used their 'magellan menu' to act as a submenu on one of my pages. However, I'm experiencing some strange issues that I can't seem to fix.

Firstly, when I click on a link in the menu and brought down to that section in the page, I need to figure out a way to add an additional offset as my magellan menu is covering the top part of that section. I haven't seen any parameters in the documentation that allows you to do this with JS.

Secondly, clicking on items in my magellan menu does what its suppose to do (i.e. take you to that section on the page). However, I am noticing some weirdness with active links being highlighted when they are not suppose to as you manually scroll. In most cases, menu links are highlighting before you reach the section. There are also some sections where highlighting gets skipped completely. I'm really not sure what's going on.

You can take a peak at a sample page with these issues here: http://bit.ly/1mkT3Sl. Hopefully I explained everything clearly but if not, feel free to let me know and I'll attempt to clarify... ;)

Thanks!
0
Comment
Question by:Adam
  • 2
5 Comments
 
LVL 1

Author Comment

by:Adam
ID: 39799873
If it helps, I believe I have come up with a quick solution for my first issue (adding an offset when you click on a menu item and it takes you to the section). I've basically just added some jQuery and used scrollTo to animate users to the respective sections (and manually put in the offset).

But still trying to understand why the menu highlighting is all off. I posted this question on the Foundation forum here...but still waiting for a response.
0
 
LVL 1

Accepted Solution

by:
Adam earned 0 total points
ID: 39821133
Managed to find a partial solution to my issue here:

http://foundation.zurb.com/forum/posts/1667-magellan-menu-weirdness
0

Featured Post

Master Your Team's Linux and Cloud Stack!

The average business loses $13.5M per year to ineffective training (per 1,000 employees). Keep ahead of the competition and combine in-person quality with online cost and flexibility by training with Linux Academy.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Because your company can’t afford for you to make SEO mistakes, you’ll want to ensure you’re taking the right steps each and every time you post a new piece of content. This list of optimization do’s and don’ts can help you become an SEO wizard.
FAQ pages provide a simple way for you to supply and for customers to find answers to the most common questions about your company. Here are six reasons why your company website should have a FAQ page
In this tutorial viewers will learn how to style a decorative dropcap for the first letter in a paragraph using CSS. In CSS, create a new paragraph class by typing "p.fancy": Then, to style only the first letter of the first sentence, include the ps…
In this tutorial viewers will learn how to embed custom externally-hosted Google Fonts using the Google Font API in CSS Go to the Google Fonts website at google.com/fonts: Browse or search based on font properties or name to find a suitable font for…

777 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question