Sidebar Menu Using Html CSS & Javascript | Curved Outside in Active Tab
HTML-код
- Опубликовано: 29 июн 2021
- Enroll My Course : Next Level CSS Animation and Hover Effects
www.udemy.com/course/css-hove...
Another Course : Build Complete Real World Responsive Websites from Scratch
www.udemy.com/course/complete...
------------------
Join Our Channel Membership And Get Source Code of My New Video's Everyday!
Join : / @onlinetutorialsyt
------------------
Source Code : / onlinetutorials
Facebook Page : / onlinetutorialsyt
Instagram : / onlinetutorials_youtube
Twitter : / onlinetutoria16
Website : www.onlinetutorialsweb.com
Buy Me A Coffee : www.buymeacoffee.com/onlineTu...
------------------
#csseffect #html #css
------------------
give proper credit if you repost this on other social media platform
------------------
Also Wath
How to Create Responsive Sidebar Menu Using Html CSS & Javascript | Dashboard Sidebar Menu
• How to Create Responsi...
Pure CSS Sidebar Menu | Off Canvas Menu Effects with Smooth Page Scroll Using Html CSS Only
• Pure CSS Sidebar Menu ...
Responsive Navigation Bar With Html CSS and Javascript | Responsive Sidebar Menu For Mobile
• Responsive Navigation ...
------------------
image source : www.pexels.com/
------------------
Disclaimer video is for educational purpose only. Copyright Disclaimer Under Section 107 of the Copyright Act 1976, allowance is made for "fair use" for purposes such as criticism, comment, news reporting, teaching, scholarship, and research. Fair use is a use permitted by copyright statute that might otherwise be infringing. Non-profit, educational or personal use tips the balance in favor of fair use
Click For More : ruclips.net/user/OnlineTutorials4Designersvideos?sub_confirmation=1
🎩
To be honest, everyday I start watching one of your random/latest video to get inspiration. I want to be a Full Stack Developer and for the Front-end I always want to imitate you for beautiful animations and designs. You're the best 💯
stunning art from this god of css, keep doing this georgeous designs. I've seen all your videos since two years ago until today and i will continue to wacht them. Greetings for you, i love your work
Watching it changing from a text to extraordinary is amazing
I like the fact that I can easily understand your coding without you saying a single word.
you can achieve the same thing with before and after instead of adding extra b tags
Will you please discribe your trick in little shott note? Ty in advance
@@usmanraja126 the owner of this channel has published a new video using before and after you can just go ahead and watch that
@@namhoang5550 okay, buddy. 👍👏
@@namhoang5550 did he post it before or after?
@@riccello please check the pinned comment
This is the only channel i like about programming, esthetics and etc 💖💖💖💖
Glad you liked my channel
i think you can make it better, for example using ::before / ::after with position: absolute to make the rounded corners of the selected element of the menu, to avoid using extra html elements cause they are just styleshy feature and not part of the page content, or make the toggle menu button work with a checkbox input, and make the list menu manage the selected element with radio inputs, to avoid using js features related just with visual
GENIUS. You never cease to amaze me. THANK YOU!
how elegant it turned out
you're a big lad!!
Thank you for sharing - it will help me. I also think that you should put the burger menu in navbar, first position (before profile).
I´m so glad for this channel
You are amazing sir.
Apse inspire hoke mene bhi aapna channel open kiya h pr subscribers hi nahi ate
Give me heart sir 😊♥️
I am in love with it tutorial bro, keep going pls.
Mind blowing coding sir Zakas 🔥
Well that's one way of doing it... what a journey
Very amazing
Thinking from Thumbnail
I really like your videos, thank you ❤️
Without having a separate tag you can use the pseudo tags "::before" and "::after" to get the outside curve.
yes, it's the same i thought
Congrats bro.And thx for the tutorial 👏
god-level skills 🚀
Keep going bro...We will support u
I wanted to subscribe, but i'm already subscribed. Seems like the old me was wise.
I learned best practice: it’s much better to copy-paste word “list” than writing it
Am really impressive. So many details for menu. tag in the end was unexpected decision.
Great job. Thanx for video
شرح رائع 👏🏻🌹
Super bro, up to now i have no idea that we can do outside curves border
Wonderful tutorial! Thanks! 😁😁
How come this music sounds really good no matter how much you increase or decrease speed? Is this the beauty of this particular piece or all piano piece have this intrinsic property???
This is very nice but can you do it with an animation when you switch the active list item?
Pro Players
I love this channel ❤️
Thanks for your work 💓💓💓
Stunning! 🤩
Thank you!! 😊
this is vary helpful for me...
That's spectacular 😱
That's amaaazingggg !!!
You guys are legends
Your UI work is always brilliant, I'm learning a lot
Glad to hear that!
No speaking, no explanation, we can't learn just by watching it!!!
It's like seeing a magic trick, we need to know how and why you arrived at such a result.
This is less of learning and more of projects making channel. For learning u can watch many beginners videos on youtube and after that u can start making projects from this channel.
Telegram group : t.me/onlinetutorialsYTb
Can you make a next lavel about us page in html and css????
Sir,, I didn’t found your app link. Please send me your app link😭😭😭
Sir please make a video on making colourful code box.
I'd understand a lot more if he could explain while coding. Anyways good job brother, love your grind.
I think these tutorials are meant to people who already know HTML, CSS and JS, so the mark-up, classes and code should be easily understood, and it's more about how to put a solution together.
@@OneAndOnlyMe I have just started learning front-end development last month only. You know CSS can get a bit overwhelming at times . Maybe, I have to put in more time beore I can fully understand the concepts watching just once. Any tips for me (a newbie)?
Wow, a ma zing, love for this video
that's amazing
thanks bro ❤
very detail thank creator very much
I love how he uses the mouse to communicate with the audience
Awesome Sir Ur are Great (y)
galing naman
Amazing video bro, but this music scares me especially when I watch these videos, during the night || xD
This is superb 👌
Thank you very much my friend!!!
Wow amazing thank you so much
Nice video, new to coding. Quick Question: The Menu works great when there are dead links all the transitions are smooth icon to icon, but when I link to another page/html file within the same directory the menu no longer functions. It becomes static on one icon, any help or examples of a two page layout would would be greatly appreciated.
i am also facing the same problem ,please help
THANK YOU FOR COMMENTS WITHOUT VOICE =)
I LIKE IT !
YEYEYEYEYEYE😍😍😍😍
just put :: after :: before
why using two s
Watch here ruclips.net/video/pubrK_AmqRg/видео.html
Another Way : ruclips.net/video/pubrK_AmqRg/видео.html
Use material theme in the editor. The dark pink color of html tags look bad and very hard to read. Use contrast or material theme.
Where is your telegram link?
Why you dont use your voice for making this tutorial easy ?
and link all files from lessons
the piano name ????
That’s really awesome 😍
I very like this channel sir
You are so close to 500K sub lets goooooooooooo
Cool, it would be cooler with animations
good, solo es paciencia y ver bien
Awesome Video. Thanks alot.
Perfect.
King online tutorials Nice kanal
Active element, before element and after element condition css simple
*Nice bro well done..!*
thank you so much !
I would like to see more video lessons about jquery
AMAZING BRUH 🔥
AMAZING
Thank you sir.
is there any sample for the same in React?
Very nice 👌⭐⭐⭐⭐⭐
Great man
thank you bro
you are the best
Your Fan is here ❤️😊
These tutorials would be more clear and better with your voice or some sorta subtitles, plz explain while doing these tutorials.....otherwise your vidoes are really great
You gained a sub
You should start a free of cost css tutorial. YOU WILL GROW EVEN FASTER SIR PLZ.
Awesome,,, really nice 👍👍👍
Thank you! Cheers!
Eres adictivo 😍
Please can you upload the recordings on RUclips.
I don't care the comments where they say "You can do this better", I really tahnk you for this!!
Nice one Sir
amazing creative;)!!!
Div's in 2021?
Not better, when we will be using the HTML5 selectors such as: nav, section etc. ?
I think we use semantic elements interchangeably with non semantic elements
No point in tutorials, most of those other selectors are really just for SEO.
Div is very versatile
Nice work bro
This is gonna be good mark my words 🙂
amazing
sooooo goood thanks
It would be good if you just reveal the whole menu on hover instead of clicking on bar icon
it's cooooool!!!
Brutal
Superb 👌
Thanks for liking
Respected sir can you please provide it's code?
Hello,
The app design is nice, but the b tags are bordered in mobile view.
if you change the white-space = normal to nowrap the sing out will look better
How about dealing with textured background image instead of solid blue color?
I like you man ❤️
Very nice...
AOA!
I have an idea for you.
I want you to make a page on which there are some English alphabets of large size and what i want is that whenever you hover over some alphabets it displaces all those alphabets and the area under the cursor becomes empty and the letters are floating randomly.
you are doing such a great job. your videos are really helpful and i am able to learn so much from you.