jQuery tabs with animations, shadows and rounded corners

jQuery tabs with animations, shadows and rounded corners

jQuery tabs con animación, sombras y esquinas redondeadas

In the next update of my Youtube Channel Gallery Wordpress plugin, I am going to organize the different parts of my plugin in tabs. Although my first thought was using the jQuery UI tabs, I noticed that, if another plugin was using that same widget, it would overwrite the styles of my plugin and I did not need something so complex either. There are many examples about how to create a tab system using only jQuery and in a simple way, but I wanted something with more detail, with animation between tabs, shadows and rounded corners.

The JavaScript would be as follows:

The CSS would be as follows:

And finally, the HTML will look like this:

Tags:
©2019 PoseLab SL. All rights reserved.