How To Make Drop-down Profile Menu Using HTML CSS & JavaScript | Toggle Menu For Website
HTML-код
- Опубликовано: 15 авг 2022
- Learn How To Make Drop-down Profile Menu Using HTML CSS & JavaScript | Toggle Menu For Website Using HTML CSS JS Step by Step
❤️ SUBSCRIBE: goo.gl/tTFmPb
In this video we will learn to create a drop-down menu for user profile. If I click on this profile icon, It will open a drop down menu and if we click again it will hide this drop down menu. I have added some Hover effect in this menu link. Wen I move cursor over this link, the font gets bold and the arrow icon moves right side.
We will make this user profile menu design using HTML, CSS and very simple JavaScript.
Download Image: drive.google.com/file/d/1gloe...
-----------------------------------------
Suggested Course:
❤️ Complete website Using HTML and CSS
✔️ 8 Complete website step by step
✔️ Source Code Download
✔️ 76 Lectures, 12 Hours Video
✔️ Course Completion certificate
👉 easytutorialspro.com/go/course/
-------------------------------------
Recommended Videos:
Learn Complete HTML and CSS from basics:
► • HTML And CSS Tutorial ...
Make A Complete Website for college using HTML & CSS:
► • How To Make A College ...
How to make a Business website step by step:
► • How To Make Website Us...
How to make personal resume website step by step:
► • How To Make A Website ...
How to make fitness website design using HTML CSS:
► • How To Make A Website ...
How to make an Ecommerce Website Design:
► • How To Make eCommerce ...
How to make a Job Portal website design with HTML & CSS:
► • How To Make Website Us...
How to make travel website design with HTML CSS Bootstrap:
► • How To Make A Website ...
-------------------------------------
Affordable web hosting (coupon- EASYTUTORIALS)
👉 easytutorialspro.com/hosting/
My recommended tools and tutorials
👉 easytutorialspro.com/
-------------------------------------
◼️ Source code link is shared in community post for all my coding videos exclusively for channel members (only channel members can see)
Join Channel Membership:
► / @greatstackdev
-------------------------------------
Images Credit:
www.pexels.com/
-------------------------------------
Like - Follow & Subscribe us:
◼️ RUclips: goo.gl/tTFmPb
◼️ Facebook: goo.gl/qv7tEQ
◼️ Twitter: / itsavinashkr
◼️ Instagram: / iamavinashkr
Learning a lot from you dude and the best thing ab ur tuts are you explain very well what and why u r doing and provides us the resources to practice with u as well....Much love and respect For you❤
Wow I have a project that I need something like this for and I got this notification you keep saving lives bro
You are THE MAN!
Thank you so much for this quick and easy explanation! I greatly appreciate this video and your help!
+1 subscribed!
You are so sharp. I thought to search this title , but you already uploaded ⚡
Thank you very much! I was trying for a long time to make this menu and your video was super cool, explained without rolling and very well! I managed to do it!
Kudos to you my Boss and Tutor. I have so much learnt from you and infact, you are the one who made me understands coding. Please can you make a mini project with a touch of BackEnd?
Loved it ❤️, thank you!👏
Thanks for beautiful tutorial's. Your tutorials are all ways on the point. And ui is super clean and fresh and bigginer freindly & cool thing.
Easy Tutorials, i love your youtube tutorials don't stop champ.
Je peux que te dire merci car tes vidéos sont de très bonne qualités et me sont d'une très grande aide
Super helpful. Thanks!
its really helpful and if you can more explain about the css classes or ids its will be more helpful thanks carry on.
Loved it❤
Love from Nepal bro ❤️
I like this!
Thank you🙏🙏
Respect sir. you helped me understand a lot
Great Video, It was really helpful, i copied everything you did and i understood it, Keep it up
you'r really great, man. thanx a lot.
thanks bro you're the best
your video is great you write simple code i easy understand
Thanks bro Allah bless you 🙏
Awesome lesson. Was easy to follow & straightforward👍
Amazing 🤩
Amazing it really really helped thank you so much
It helps us to achieve the dropdown menu, but I think you should explain why you need multiple divs and some of the css syntax. We're just following blindly instead of understanding the whole process.
A good tutorial if you're doing dropdown menu once in a while but horrible if you want to understand the fundamentals behind achieving a dropdown menu.
basically, we need multiple divs accordingly, for example if you wanna position 2 or 3 things in one wrapper, you gotta add multiple divs for "wrapping" them, a main boss div then a positioning div then your element personal div, it depends on what you wanna make, if you feel confused add multiple divs and give them all different color borders, padding and margin, it'll help, and I suggest you to gain more information about newfound things so that you can understand and won't be needing tutorial for the next time.
thanks for sharing this information
Thank you sir
Op bro🔥
Thank you!
Very good!
Thanks you so much
Thank You so much , you solved ,my big problem tqtqttqtq
Awesome
man i could kiss u rn, ive got an assignment due and this was on the distintion page, thanks sm man, now i can finally rest
thank you
Nice 🤗
Good job
Thank you
I'm your fan bro ...
But pls can you make for us how to integrate payment method on e-commerce website
helpful :)
Gracias!!!!!
i love you man❤❤😂😂
bro pls make a content out with slide out multilevel fixed sidebar with vanilla js!
thx ❤
Hi, could you shoot the following video about logging in and registering on the site, it would be interesting
❤❤❤ nice
Now how to link that elements to get the content? I mean how it will navigate to other page( like editing the profile)
Thank you so much ❤️🙏🏻
best video
Can you drop a video on the admin page for a buying and selling website
great
Thanks
Its Amazing! But How to hide(Toggle) the menu when the user click somewhere else not on profile ?
Can you make a portfolio for intermidiates
Hii Sir can you tell me how to keep this if we click anywhere in empty page that should be gone the profile dropdown please sir tell me
Please make admin panel Completely like metronic template using only html css js
Bro make a tutorial video on javascript
I'm a newbie. the dropdown menu not working. it's showing ( Uncaught ReferenceError: menu is not defined )
Sir can you design a user profile dropdown menu it should only work when the user is successfully logged in to the website and profile dropdown should be displayed on click user icon❤❤
Do you have any website projects
Ap logo that means image Kase banate ho sir please reply me!!
there is no source code link in channel community, How I access the source code
Source code link ruclips.net/video/Th_S7kHnm1g/видео.html
Cannot read properties of null (reading 'classList') Please help me sir 🙏🙏🙏🙏
Someone else might see this so... make sure the class name is written correctly. Try doing console.log(document.getElementsByClassNames("yourelementsname")) to see if your spellings the same
Can u make this in react js?
Theme name u use in vs code ?
brackets
PLEASE what are u pressing to duplicate a code
is it responsive ..?
Source code please
Its not work drop down in last stage
plz provide the source code
give me code css and html please
source code ???
no source code??
I have question
Q:-can we use flex box and CSS
grid together
If(Ans is yes)
Then sir please make a project using CSS flex box and CSS grid
Flex box is basically CSS, it's just a 2 dimensional layout approach
@@olalekanemmanuel6767 then make a project using CSS flex box and CSS grid together
@@VikasKumar-hw3hn I don't understand what you mean
We can add css grid and flexbox in website
But flexbox is more easy and responsive
Not just look functioning also 😡
Bro this not at all responcive
I mean meek was in jail guys. He was missing some male booty outside so diddy offered. We can't be mad at him
When to apply in inline block and flex or it's our personal preference??? Reply
Thanks man, please make a tutorial on how to authenticate the LOGIN page!!!! To the folks around here, hit a like if you have to reduce the speed upto 0.75 and 0.5 as well anytime as the video was going on😂😂😂😂
source code ?