Delivering the best Add-Ons in more than 37 languages.

中文(简体), English, हिन्दी/हिंदी, Español/Castellano, العربية, Русский язык, Français, 中文 (台灣), বাংলা, Bahasa Indonesia, اردو, Português, Deutsch, Bahasa Melayu (بهاس ملايو‎), 日本語 (にほんご), فارسی, Italiano, తెలుగు, Türkçe, ગુજરાતી, Język polski/polszczyzna, Tiếng Việt, ಕನ್ನಡ, Українська мова, ไทย
CSS / Tabs and Sliders

Animated CSS3 Tabs

— Add-On to

Subscribe to our feed to stay up to date!

New! Follow us as you want it!

Animated CSS3 Tabs - CodeCanyon Item for Sale


Ad: Bluehost hosting

These tabs have animated effects that you would normally associate with a javascript library like jQuery. But they have been built using pure css and no javascript has been used. Further no images have been used in the styling of the tabs. They support dynamic height panes and active tab highlighting.

This item features 2 broad categories – Browser Back Button Disabled & Browser Back Button Enabled. In the latter category individual tabs can be linked to through hash tags in the url.

Each of the above categories includes 2 design styles (Fancy Tabs & Simple Tabs), 6 animated effects(Simple, Sliding, Fading, Fade & Height Animation, Scaling, Overlap), and 5 color variations (Light, Dark, Brown. Red, Green).

Basic support for IE8 and below has been extended by referencing Dean Edwards’ IE9.js.

Note: The animations only work in browsers that support CSS3 Transitions, which at the moment include Firefox 4+, Safari 4+, Chrome 4+, Opera 10.5+ & IE10+. Also CSS round corners and shadows will not be visible in IE8 and below since it does not support them. They are supported in IE9+.

Updated on 15 February 2012 – Version 2.0.1

  • Updated the css to make the Tabs more compatible with IE9+

Updated on 10 November 2010 – Version 2.0

  1. Added a “Back Button Disabled” version
  2. Added a new animation – Overlap
  3. Provided javascript code with all “Non Webkit” code to overcome Webkit bugs and make them work in Safari & Chrome
  4. Provided a javascript file to fix a Firefox quirk when dealing with “Back Button Disabled” version
  5. Provided a javascript file to fix a Opera back button bug when dealing with “Back Button Enabled” version
  6. More Items by CosmoCoder

    1VM SIIiIDVII Aac STAND SHADOW CSS3 SHADOW PACK Shadow Styles lengths Shadow Intensities Pure CSS, Images

    CSS3 RIBBON PACK Wrapping Hangi Wrapping Ribbons StyLes Rit Hanging Ribbon Styles Banner Ribbon Styles CoLour Variations Pure CSS3

    Show Photos, Audio, Video ova lie Two Display Modes Filtering FunctionaUty Multiple Gallery Sets Support Support FLuid Responsive Design Two Colour Schemes Multiple Settings

Other components in this categoryAll components of this author
CommentsFrequently asked questions and answers


27 September 10

Last Update:

High Resolution:

Compatible Browsers:
IE8, IE9, IE10, IE11, Firefox, Safari, Opera, Chrome

Files Included:
JavaScript JS, HTML, CSS

Software Version:


eCommerce, eCommerce, All Items, css3, css3 navigation, css3 styling, css3 transitions, tabs