Tab View | JavaScriptSource

Tab View

Ilya Lyubinskiy Jan 25, 2006

General

A combination of CSS and JavaScript that allows switching between several pages without loading them from server. The script emulates the behavior of tabbed controls in Windows applications.



You can put regular text on the tabs.

We have put together a collection of thousands of free JavaScripts that are available to you for use on your Web pages. The scripts are available, including a working JavaScript example of most of the scripts and the complete actual JavaScript code used.

We also have a great JavaScript Forum where you can post script requests, script questions, and more.


Categories include:
• Cookies
• CSS
• Forms
• Games
• Generators
• Image Effects
• Math Related
• Miscellaneous
• Navigation
• Page Details
• Security
• Snippets
• Time & Date
• Tools
• Tutorials
• Text Effects
• User Details

You can also use forms on the tab pages. (This one is just an example; it doesn't work.)

Username: 
Password: 
 

Notes

Source Code

Paste this source code into the designated areas.

External file

Paste this code into an external JavaScript file named: tabView.js


CSS

Paste this code into your external CSS file or in the <style> section within the HEAD section of your HTML document.


Head

Paste this code into the HEAD section of your HTML document.


Body

Paste this code into the BODY section of your HTML document


Other

Download the images using the URL below:

Add this to the end of your page:

Leave a Response

(10 comments)

Your question is beyond the scope of these comments. You will need to post it over on [a href="http://www.webdeveloper.com/forum/forumdisplay.php?f=3"]the JavaScript forum[/a]. Thanks!

Lee Oct 31, 2008

This is a GREAT script !!![br /]Thanks for making it, and making it available =)[br /][br /]it's maybe even a little too easy to use..[br /]hmmm.....[br /][br /][br /]THANKS AGAIN

tarkahn Jul 14, 2008

i need help , i love this script it works perfectly, but on two of the tabs the content moves when you use the mouse wheel scroller any answers? thanks[br /]bob

bob kershwey Apr 6, 2008

I'm trying to submit form data to the same tab as it was spawned, but the script always returns to tab 1.[br /]how can i make the page start on tabs other than #1, like a named anchor?

Jonathan Jul 20, 2007

I'm trying to add more tabs but it isn't working. I must be missing something. Is there some trick?

Susan Mar 7, 2007