Click here to Skip to main content

Catalog.CodeProject.com


Rate this:   Poor Excellent
Please Sign up or sign in to vote.
Item Details
License: Free For Personal Use
Technologies: C#, Javascript, CSS, HTML, XHTML, .NET, Mobile (Mobile, iPhone, Android, Blackberry, Windows-Phone-7), Cloud, ASP.NET, PHP, WebForms, jQuery
Last Updated: 3 Jan 2012

Contact Information
Contact Name:
jqwidgets
Company /
Organisation:
jqwidgets
Email:
info@jqwidgets.com
Email Format:
Html
Address 1:
382 NE 191st St 28935 Miami, FL 33179, USA
City:
Miami
Zip / Post Code:
33179
Country:
United States
Phone:
+1 786 600 1810
URL:
http://jqwidgets.com

jQuery Tabs Widget

jqwidgets
Version: 1.3

Description

 
By using jqxTabs widget, you can define multiple pages for the same area of a page. You can populate it from pairs of 'LI' and 'DIV' elements for each tab item. 'LI' elements represent the tab titles, where the 'DIV' elements represent the tab contents.
 

Featues

 
The widget comes with built-in keyboard navigation, animated scrolling, selection with built-in ‘lava lamp’ effect and google chrome-like tabs reorder behavior. With jqxTabs, you can easily display a close button in each tab and even lock the selection of specific tabs.
 

HTML

 
The HTML markup below, creates 2 tabs with tab titles - 'Tab 1' and 'Tab 2' and tab contents - 'Content 1' and 'Content 2'
      <div id='jqxtabs'>
        <ul style='margin-removed 20px;'>
            <li>Tab 1</li>
            <li>Tab 2</li>
        </ul>
        <div>
            Content 1
        </div>
        <div>
            Content 2
        </div>
 

jQuery

 
The following script creates the jqxTabs widget. The basic configuration includes setting the tabs width and height.
 
$('#jqxtabs').jqxTabs({ width: 550, height: 150 });
 

Browser Support and Mobile Device Compatibility

 
The product supports all major desktop and mobile web browsers - Internet Explorer 7.0+, Firefox 2.0+, Safari 3.0+, Opera 9.0+, Google Chrome, IE Mobile, Android, Opera Mobile, Mobile Safari(IPhone, IPad).
 
Documentation: http://www.jqwidgets.com/documentation
Samples and Demos: http://www.jqwidgets.com/jquery-widgets-demo

 
 
 

Advertise | Privacy | Mobile
Web01 | 2.8.140415.2 | Last Updated 10 Aug 2007
Copyright © CodeProject, 1999-2014
All Rights Reserved. Terms of Use
Layout: fixed | fluid