Aptabs

Demo

Submitted script - Author: Armel Pingault(Homepage)

Download script

You can download the entire script from this Zip file

Setup

Step 1: Include the css and javascript files

Step 2: Create your html

To create tags, the main <div> needs to feature the attribute class="apTabs"; you may also specify the width and height of the frame in the "style" attribute.

To create a new tab, you will only need to add a <h2> tag with the name of the tab followed by the tab content in a <div> tag.

Example:

<div class="apTabs" style="width:500px; height:100px">
   <h2>Tab 1</h2>
   <div>Tab content 1</div>
   <h2>Tab 2</h2>
   <div>Tab content 2</div>
   <h2>Tab 3</h2>
   <div>Tab content 3</div>
</div>

Comments

Hello Armel Pingault: Today,I use your Aptabs plugin in my project,but I am a newcomer to use prototype.In the plugin,I want to expand some new function to apply to my project,such as add tab dynamic,I want to ask you whether the Add function in you script could finish this task.The other question,for example,'add:function(e,tab){.....}',what 'e' it is,it means a javascript standart event?Please answer my question,Thank you very much!

Jerry Victor at 02:33AM, 2011/06/22.

This doesn't work in IE8.

Steve at 08:49PM, 2011/08/26.

Can anyone figure out how to get this to work in IE8? Seem like it would be pretty cool! I am getting the following error:

Webpage error details

User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; WOW64; Trident/4.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET4.0C; InfoPath.2; .NET4.0E; OfficeLiveConnector.1.5; OfficeLivePatch.1.3)
Timestamp: Wed, 31 Aug 2011 06:28:40 UTC

Message: 'down(...)' is null or not an object
Line: 223
Char: 3
Code: 0
URI: http://www.dhtmlgoodies.com/submitted-scripts/aptabs/src/aptabs.js

thanks!

Steve at 06:23AM, 2011/08/31.

it working in firefox but not working in IE7&8

mangesh at 06:22AM, 2011/09/28.

great work!! if you upgrade prototype.js to version 1.7 then it works also in IE 8 and 9 !!

arbyter at 04:01PM, 2011/11/21.

Hi Armeli am using your tab-script, it works well;Now i have a question; i would like to have twoline Tab-Lables but it does not expand the height of the tabs. Any succestions?

Arbyter at 03:50PM, 2012/01/06.

Post your comment

Please wait...

Your name:
Your email:
Your website:
Don't have an avatar? Create one at Gravatar.com.