Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS

Posted by Don Macarthur
Don Macarthur
28,430 Points

Help With Media Queries / Hamburger Menu

Hi guys,

I've been putting together my personal portfolio page and have been having troubles with the Hamburger Menu.

It all works fine but I am seeing an issue where when I resize the browser as it reaches the smallest breakpoint (768px) the menu briefly appears before sliding away.

I can't for the life of me figure out why this is happening.

Any suggestions?

My source files are in this GitHub repository: https://github.com/Donatron/My-Portfolio

Thanks in advance for any help. Don :-)

Bogdan Cabaj
Bogdan Cabaj
16,349 Points
Bogdan Cabaj
Bogdan Cabaj
16,349 Points

I'm not an expert but I was able to make two small changes and got it to work. Please see your github pull request.

1 Answer

Vlad Legkowski
Vlad Legkowski
9,882 Points

Hi Don, I also had a look and and manage to fix the issue by adding

.main-nav { display: none;}

$('.nav-toggle').click(function() {
  $('.main-nav').css('display', 'block');})
Don Macarthur
Don Macarthur
28,430 Points

Thank you both Vlad and Bogdan. Both solutions do the trick. This has been a source of much frustration for me the last few days!

Thanks again Don :-)