Ajax auto complete
Ajax Blog Scripts
Ajax Calendar Scripts
Ajax Chat Scripts
Ajax CMS Scripts 
Ajax File Manipulation
Ajax Forms
Ajax Forum Scripts
Ajax Frameworks
Ajax Image Galleries
Ajax Joomla Scripts
Ajax menus
Ajax Rating Scripts
Ajax RSS Scripts
Ajax Shopping Carts
Ajax tabs
Ajax Window Scripts
Ajaxed Online tools
Webmail scripts
Other Ajax Scripts
Visitors
 

Online Users:

 

Home Sitemap About
 

Ajax tabs

 

Tab panes

Next Script =>

 

 

Script Description :

It's easy to configure this script. You put your content into separate &ltDIV>s and then call a javascript function which creates the tabs dynamically.
Example:
<div id="dhtmlgoodies_tabView1">
  <div class="dhtmlgoodies_aTab">
    Content of tab 1
  
  </div>
  <div class="dhtmlgoodies_aTab">
    Content of tab 2
  
  </div>
  <div class="dhtmlgoodies_aTab">
    Content of tab 3
  
  </div>
  <div class="dhtmlgoodies_aTab">
    Content of tab 4
  
  </div>
</div>
<script type="text/javascript">
initTabs(Array('Menu scripts','Calender',
'Menus','About us'),1,500,400);
</script>

<div id="dhtmlgoodies_tabView1"> is parent to the content of all your tabs. Inside it, you have one <div class="dhtmlgoodies_aTab"> for each tab window. Put the content of your tabs inside them.

You initialize the script by calling the initTabs() function. Arguments sent to this are:

  • ID of parent element, example: dhtmlgoodies_tabView1
  • Array('Menu scripts','Calender','Menus','About us') = An array of tab labels
  • 1 = Index of active tab(0 = first tab, 1 = second tab...)
  • 500 = Width of tab pane
  • 400 = Height of tab pane(Use empty string("") if you want dynamic height)
  • Array(false,true,true,true) = Array of close button visibility. One item for each tab. When set to true, a close button will appear at the top right corner of the tab

Create new tab dynamically

You can call the function createNewTab() when you need to create a new tab dynamically. Arguments to this functions are:

  • Tab title = Tab title as string
  • Content = Tab content as string(optional)
  • Url to content = Url to file(optional). The content of this file will be loaded dynamically by Ajax

Remove a tab

You can remove a tab by calling the function deleteTab(tabTitle). Input to this function is the label of the tab you want to remove, example: deleteTab('Menu scripts');

Add content dynamically to one of the tabs

You can use the function addAjaxContentToTab to add content from an external file dynamically to one of the tabs. This function takes two arguments:

  1. Title of tab, example: "Menu scripts"
  2. Relative path to external file, example: "includes/external.inc"

Example: <a href="http://freeajaxscripts.net/#" onclick="addAjaxContentToTab('Menu scripts','includes/external.inc');return false">Add content<A>

 

 

Script Information :

 

Website:                     http://www.dhtmlgoodies.com/index.html

Demo:                         See Demo

Download:                  Download Script

 

 

Free AJAX Scripts by Ajaxfreescript.com

 


   

©Krishna Eydat 2008

 Sitemap       Contact Us