Easy Responsive Tabs
[row]
[column lg=”12″]
[/column]
[/row]
[row]
[column lg=”12″]
[/column]
[/row]
[row]
[column lg=”12″]
[/column]
[/row]
[row]
[envato type=”compact” username=”oscitasthemes” market=”codecanyon” price=”false” ref=”oscitasthemes” currency=”$” count=0 bootstrap=”1″]
[column lg=”12″]
[iconheading type=”h2″ style=”glyphicon-circle-arrow-down”]Normal bootstrap tabs example [/iconheading]
[notification type=”alert-warning” close=”false” ]This is how normal bootstrap tabs looks, if you have more tabs which can fit to the space[/notification][/column]
[column lg=”6″]
[tabs]
[tab title=”Easy Responsive Tabs” active=”active”]Tab 1 content goes here.[/tab]
[tab title=”Easy Bootstrap Shortcodes”]Tab 2 content goes here.[/tab]
[tab title=”Easy Parallax Slider”]Tab 3 content goes here.[/tab]
[tab title=”Sample tab number 4″]Tab 4 content goes here.[/tab]
[tab title=”Sample tab number 5″]Tab 5 content goes here.[/tab]
[tab title=”Sample tab number 6″]Tab 6 content goes here.[/tab]
[tab title=”Sample tab number 7″]Tab 7 content goes here.[/tab]
[tab title=”Sample tab number 8″]Tab 7 content goes here.[/tab]
[tab title=”Sample tab number 9″]Tab 7 content goes here.[/tab]
[tab title=”Sample tab number 10″]Tab 7 content goes here.[/tab]
[tab title=”Sample tab number 11″]Tab 7 content goes here.[/tab]
[tab title=”Sample tab number 12″]Tab 7 content goes here.[/tab]
[/tabs]
[/column]
[column lg=”6″ ]
[iconheading type=”h2″ style=”glyphicon-circle-arrow-down”]Easy responsive tabs example [/iconheading]
[notification type=”alert-success” close=”false” ]This is how easy responsive tabs looks in same area, it shows more option if tabs not fit into the given area.[/notification]
[restabs alignment=”osc-tabs-left” pills=”nav-pills” responsive=”true” icon=”true” text=”More”]
[restab title=”Easy Responsive Tabs” active=”active”]
Sample content for Easy Responsive Tabs content goes here. Creating responsive tabs was not that much easy before this plugin.
[/restab]
[restab title=”Easy Bootstrap Shortcodes”]
Easy Bootstrap Shortcode enable you to add bootstrap 3.0 styles in your pages, post and custom post in simplest manner.
[thumbnail border=”1″ src=”http://demo.oscitasthemes.com/wp-content/uploads/2013/10/banner-772×250.png”]
View Demo |Download
[/restab]
[restab title=”Easy WP Parallax Slider”]
Easy WordPress Parallax Slider is a wordpress plugin with CSS3 and jQuery. Drag n drop admin functionality to set the show order of slides.
[thumbnail border=”1″ src=”http://demo.oscitasthemes.com/wp-content/uploads/2013/10/banner-772×250.jpg”]
View Demo |Download
[/restab]
[restab title=”Sample responsive tab number 1″ ]Tab 1 content goes here.[/restab]
[/restabs]
[/column]
[/row]
[separator style=”separator-double-thick-thin”][/separator]
[iconheading type=”h2″ style=”glyphicon-ok” icontype=”glyphicon”]Tabs selection on page reload or any external link click[/iconheading]
[row]
[column lg=”12″ md=”12″ sm=”12″ xs=”12″]
[restabs icon=”true” text=”More”]
[restab title=”Tab number 1″ active=”active”]This demo is to show that we can use some other links in tab content to activate any particular tab.
To select Tab2 Click Here
<a onclick="jQuery(this).parents('.tabbable').find('li:eq(2) a').tab('show');" href="javascript:;">Click Here</a>
[/restab]
[restab title=”Tab number 2″]Tab 2 content goes here.[/restab]
[restab title=”Tab number 3″]Tab 3 content goes here.[/restab]
[restab title=”Tab number 4″]Tab 4 content goes here.[/restab][/restabs]
[/column]
[/row]
[separator style=”separator-double-thick-thin”][/separator]
[iconheading type=”h2″ style=”glyphicon-ok” icontype=”glyphicon”]Tabs selection on click of any other link in tab content[/iconheading]
[row]
[column lg=”12″ md=”12″ sm=”12″ xs=”12″]
[restabs icon=”true” text=”More”]
[restab title=”Tab number 1″ active=”active”]This demo is to show that we can use some other links in tab content to activate any particular tab.
To select Tab2 Click Here
<a onclick="jQuery(this).parents('.tabbable').find('li:eq(2) a').tab('show');" href="javascript:;">Click Here</a>
[/restab]
[restab title=”Tab number 2″]Tab 2 content goes here.[/restab]
[restab title=”Tab number 3″]Tab 3 content goes here.[/restab]
[restab title=”Tab number 4″]Tab 4 content goes here.[/restab][/restabs]
[/column]
[/row]
[separator style=”separator-double-thick-thin”][/separator]
[iconheading type=”h2″ style=”glyphicon-ok” icontype=”glyphicon”]Tabs selection on click of any other external link[/iconheading]
[row]
[column lg=”12″ md=”12″ sm=”12″ xs=”12″]
Select tab2 | Select tab3
[restabs icon=”true” text=”More” class=”example2″]
[restab title=”Tab number 1″ active=”active”]This demo is to show that we can use some external links to activate any particular tab.
To select Tab2 Click Here[/restab]
[restab title=”Tab number 2″]Tab 2 content goes here.[/restab]
[restab title=”Tab number 3″]Tab 3 content goes here.[/restab]
[restab title=”Tab number 4″]Tab 4 content goes here.[/restab][/restabs]
Code
<a onclick="jQuery('.example2').find('li:eq(2) a').tab('show');" href="javascript:;">Select tab2</a>
<a onclick="jQuery('.example2').find('li:eq(3) a').tab('show');" href="javascript:;">Select tab3</a>
[/column]
[/row]