As suggested by KK Sir, I am posting this topic here:
I am trying to use these tabs (as in attached image).
The code for the same, without the couch tags, is:
and the required files are also attached in the zip folder.
What i want to achieve is that:
1. I want the entire tabs add the content for the tabs to be in a repeatable section. (That will be visible in the code)
2. I want to be able to add new tab and its content as would be the requirement.
Please throw light on the same!!!
I am trying to use these tabs (as in attached image).
The code for the same, without the couch tags, is:
- Code: Select all
<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
<head>
<title>Soap</title>
<link rel="stylesheet" type="text/css" href="css/main.css">
</head>
<body>
<!--[if lt IE 7]>
<p class="chromeframe">You are using an outdated browser. <a href="http://browsehappy.com/">Upgrade your browser today</a> or <a href="http://www.google.com/chromeframe/?redirect=true">install Google Chrome Frame</a> to better experience this site.</p>
<![endif]-->
<!-- ///////////////////////////////////
TABS
//////////////////////////////////// -->
<!-- Tab Container -->
<div class="tab-container">
<!-- Navigation for Tabs -->
<ul class="tab-nav left">
<li data-tab="tab1" class="active">Tab 1</li>
<li data-tab="tab2">Tab 2</li>
<li data-tab="tab3">Tab 3</li>
</ul>
<!-- Tab Content -->
<div class="tab-content-block clearfix">
<!-- Tab Content -->
<h3 class="v_nav v_active" data-tab="tab1">Tab 1</h3>
<div id="tab1" class="tab_content clearfix">
<p>Maecenas faucibus mollis interdum. Cras mattis consectetur purus sit amet fermentum. Donec id elit non mi porta gravida at eget metus. Vestibulum id ligula porta felis euismod semper. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed posuere consectetur est at lobortis. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
</div>
<!-- Tab Content -->
<h3 class="v_nav" data-tab="tab2">Tab 2</h3>
<div id="tab2" class="tab_content">
<p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Cras mattis consectetur purus sit amet fermentum. Donec id elit non mi porta gravida at eget metus. Vestibulum id ligula porta felis euismod semper. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed posuere consectetur est at lobortis. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
</div>
<!-- Tab Content -->
<h3 class="v_nav" data-tab="tab3">Tab 3</h3>
<div id="tab3" class="tab_content">
<p>Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed posuere consectetur est at lobortis. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
</div>
</div>
<!-- End Content -->
</div>
<!-- End -->
<!-- Start Scripts -->
<script type="text/javascript" src="js/vendor/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="js/fitvids.min.js"></script>
<script type="text/javascript" src="js/fancybox/jquery.fancybox63b9.js?v=2.1.4"></script>
<script type="text/javascript" src="js/cleantabs.jquery.js"></script>
<script type="text/javascript" src="rs-plugin/js/jquery.themepunch.revolution.min.js"></script>
<script type="text/javascript" src="js/main.js"></script>
</body>
</html>
and the required files are also attached in the zip folder.
What i want to achieve is that:
1. I want the entire tabs add the content for the tabs to be in a repeatable section. (That will be visible in the code)
2. I want to be able to add new tab and its content as would be the requirement.
Please throw light on the same!!!