Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

JavaScript

Maximillian Fox
PLUS
Maximillian Fox
Courses Plus Student 9,236 Points

jQuery and developing the mobile dropdown - is this best practice?

I've just been reading into the code for the jQuery examples for creating the dropdown menu to appear when the browser window is smaller. I can see though that there may be a problem if for some reason your mobile or tablet has JavaScript disabled (please correct me if the following is not right though).

What I'm thinking - essentially because the JQuery is responsible for actually creating the navigation dropdown and filling it out with the hrefs and link text, but the CSS is responsible for showing and hiding it and the navigation menu, a user with their JS disabled using the site would not be able to see a menu at all on mobile, because the CSS would hide the navigation, but try to then show an element which doesn't exist because jQuery couldn't create it. This would stop them navigating your site.

Would it be better practice to have the select menu already setup with the HTML body and set it to display:none initially in the CSS, and then use a media query for showing and hiding them, without jQuery? Or would it be better to assume that most mobiles will have JS enabled and to not worry about that?

I know the focus has been on using jQuery and learning its functions (which is awesome, and really enjoying this as it's my first venture into jQuery), but just thought it was an interesting question as Andrew mentions that JS should be used to enhance the user experience but not be obtrusive, which it might be in this case?

This is the course I'm referring to: https://teamtreehouse.com/library/jquery-basics/creating-a-mobile-drop-down-menu/perfect

Any insight into this would be great, as I am still very much a front-end noob :)