How to Create Animated Tabs with Indicator using HTML, CSS & JavaScript

In this video, I will show you how you can easily create / design animated tabs / tab with indicator / sliding underline animation using HTML, CSS & JavaScript.

[bhargavsarvaria]

Thank you so much! This is really subtle, effective and useful. Saved a lot of time for me. Wish you the best!

[warrengaytero]

Youre a savior man thanks you keep growing

[PurandharaSai]

Using code in same page i have made another tab but first 2nd tab is not working first is working. Fine, can you solve it

[danielChibuogwu]

Thank you so much for taking time out to make this, it was so helpful

[SolangeBarredaMuñoz]

hello !! thank u so much for yout help! I have a question, if i want to have the header in the bottom? what do i have to change?

[arifhussain]

That's really a awesome video,
but on request please provide the source code

[brandonreid]

Can I get some help with the blue hover line, for some strange reason mine doesn't seem to transition from left to right when switching from header to header?

[sinaemami]

thanks, but when i change divs contents with something more complicated, other dives wont work, what is the problem ???
please help

[clebersonalbergaria]

Hello, great work, congratulations.

I have a doubt. This code only works once.
If I have 2 tabs with this code on the same page, only one tab will work.

is there any way to make more than one tab work on the same page?

[codeSage-x]

no git repo? how can i get the code?? nice video

[BadmintonAllOut]

Excellent.. n what should i change to make the menu sticky at the bottom? Tq verymuch.

[alamarthansyah]

it works in codepen, but, unfortunately not work in vs code.

[omidsharifzadeh]

i want have 2 sections ! i delete div but not working this

[二古-hz]

Hi!Thanks for your great work!Can I ask where I can find this code?

[JibonCare]

Bohot achhe vai..
Please ek video banao kyase apna carousel banaunga...
Owl Carousel ki tarha...
Lekin khudka, koi plugin nehi... Vanilla JS ki madad se

[bambindien]

Hi PRO :) thanx a lot for your work! Could you provide us the code snippet to make the body-height depending on content and not fixed to 250px?

[Mercenarys]

This doesn't work, the I tag isn't even an accurate element, also I isn't considered an Img tag & the class for the icon elements don't exist, what even is this? 🤔 Please do this on a code editor code-pen isn't a legitimate editor since it has variety versions.

[mdshoaibAlamgcetts]

Is there any playlist to learne CSS advance

[silvernaturemusic]

Yes don't explain anything, just keep coding as you are teaching yourself