WEB DESIGN IN FIGMA ep.11: Dropdown Menu Navigation - Free UX / UI Course 

Thanks for the Web Design in Figma series. I have been looking for real, hand-ons tutorials on Figma, and this is just what I needed... Great!

I love you! This is exactly the approach I knew it must work but wasn't sure how to make it. Helped me tremendously! Thank you!!!

You're a great teacher. The way you're able to explain things in detail to help your viewers understand not only how to do something but how it works is a skill that very few educational channels have.

*Your channel is underrated* They're really helpful contents. Not usual stereotype contents. I love it. Keep it up!

I watched till this episode and I just wanted to say thank you sir!! I am going to watch ell episodes of your series. Thank you, you helped me a lot!!!

Resources doesn't get bold when you hover on it

Wow! what a episode these is. Thanks for sharing these awesome.

This is super helpful, thanks! I am running into the error/bug of when the drop down parent is hovered, it doesn't do the hover effect. I thought it was me and rebuilt the entire nav and components...then realized it is a Figma bug. Maybe too many interactions in one component?

This is such a helpful tutorial. Thank you so much!

Thank you so much. I have been confused with Hover and Mouse Enter

This is too good thank you so much again!

If you have problems with keeping the menu overlay open, try removing the "mouse leave" interaction and instead check "Close when clicking outside" in "Overlay" under "Interaction details". Hope this helps 👍

Super helpful, finally I'm understanding a lot of little things that were not taught in my school , but I did not get how to make the radius apparent?

Thank you for all the video learning series

By far the best and most useful tutorial for building a real flexible menu. Zhank you so much.

This is great. I think we are missing the interaction when you hover on the dropdown_parent default, it doesn't change to the hover effect (black text in this case). I'm struggling in creating that interaction.

Really nice. Thank you for sharing. So helpful.

Thanks for this resource!!!!

Great tutorial, thanks :) Is there a reason the drop-down menu wasn’t made into a component?

thanks bro this tutorial is very usefull for my project :)

overlay is blinking while hover the mouse on resourcs

🔥🔥 awesome

Man, I would like to congrats you so much… your tutorials are superb. Thank you for that work you’ve done. It’s a gold mine for me. So much thank you. Could you also make an easy to digest tutorial on variables, because I have problem to Wrap my heap around this topic ? Also, one big question please… how could I be sure, that my header content is above the fold in figma since there Is no above the fold tool like, in adobe XD? Thx

another banger

Resources menu does't change color when on hovering

can you do a course on designing with ios or material guidelines

thank you

<a href="#" class="seekto" data-time="166">02:46</a> In this video, we will create a dropdown menu for the header navigation. <a href="#" class="seekto" data-time="332">05:32</a> Creating dropdown menu items in Figma <a href="#" class="seekto" data-time="498">08:18</a> Customize dropdown menu navigation in Figma <a href="#" class="seekto" data-time="664">11:04</a> Creating a dropdown menu with menu items for resources, blog, success stories, case studies, and press <a href="#" class="seekto" data-time="830">13:50</a> Designing the dropdown menu in Figma <a href="#" class="seekto" data-time="996">16:36</a> Create a dropdown parent menu item with an arrow <a href="#" class="seekto" data-time="1162">19:22</a> Create an interaction to open and close the dropdown menu on mouse enter and mouse leave <a href="#" class="seekto" data-time="1328">22:08</a> Setting up a dropdown menu in global navigation on websites

Hi! Thank you for a great tutorial! I have an issue with "about us" section of the menu. When I hover over "Resources" button, "resources dropdown" menu opens, and every part of it works perfect. Then if I do not move my mouse on the "resources dropdown" menu panels and continue moving it on the main menu panel to the "About Us" section, it is not active, and the dropdown menu remains open. How can I fix that?

I'm having problem with the alignment of that arrow it seems good in component but differs in child component as well as in prototype, can you help me with that.

thanks

Thanks so much! Only issue I'm having is if I dont put my mouse into the dropdown menu theres no way for it to disappear.. I thought maybe giving the header a "Mouse Leave" > "Close Overlay" but not a solve. Any ideas?

The problem Is that drop down menu icon didn't change from facing down to facing up

Why in my Figma, under the current variant, there is only one column Property, there is no state or type? thanks

Your dropdown link hover <a href="#" class="seekto" data-time="964">16:04</a> doesn't work, your arrow icon doesn't face up while hovering <a href="#" class="seekto" data-time="1166">19:26</a>.

How do hover and mouse enter work together? For example, when I hover over Resources, the color has to change and the drown drop has to open all altogether. How it's possible?

Thank you for the tutorial, great job. If you insert an instance of the component in another page that doesn't work . Do you have any solution ? Thanks

Is there a way to navigate from the dropdown menu to another page, and then also auto-scroll to a specific section? For example: 1. I am at the HOME page and I want to go to the ABOUT page. 2. The ABOUT page has a FAQ section at the bottom of the page. 3. In the top menu there is a button for ABOUT that also is a dropdown menu. 4. In the dropdown menu, many buttons correspond to the content of the ABOUT page. 5. At the bottom of the dropdown menu, one button says FAQ. So what I want to do is, on the HOME page, open the ABOUT dropdown menu and select FAQ. It should take me to the ABOUT page and then auto-scroll to the FAQ section at the bottom of the page. I hope I'm explaining myself clearly. Please! send help! Thanks!!!

Thank you for the great video, I've been following the series without problems until episode 9, when I click on the FAQs I can no longer scroll to the bottom of the footer, and the footer is less visible the more FAQs I open. Do you have any ideas on how to fix this?

man i am lost half way through

<a href="#" class="seekto" data-time="461">7:41</a> i cant see that state menu.

Any ideas why I can't set the Resources to Resources Dropdown interaction? When I select "Mouse enter" and "Open overlay" I don't have an option to select my resources dropdown... Super weird.

<a href="#" class="seekto" data-time="165">2:45</a>

when i hover over the resources dropdown, the dropdown menu keeps flickering

Sound quality is rather poor -he's mumbling & it's impossible to see his cursor.

too long video and unfortunately I didn't understand :(

wow this was really helpful, thanks

thanks