www.webdeveloper.com
Results 1 to 3 of 3

Thread: Simple Tab Interface (quick help)

  1. #1
    Join Date
    Apr 2012
    Posts
    9

    Simple Tab Interface (quick help)

    Hello. I am trying to have a simple interface on my website, where I have tabs within tabs. Basically, I have a bunch of tabs for a group of guns (light machine guns, sub machine guns, etc.). Then, in every sub group, I want another set of tabs with specific guns (ak47, aug, galil, etc.).

    In a nutshell, I am trying to get tabs within tabs. The javascript should be sound, but it is more of how do I label the different classes and ids.

    The first part of my code works. I have all of the first level of tabs working. However, only the first tab in the "nested tabs" works. The 2nd tab in the "nested tabs" does not work.

    I just need to know what to set the last javascript snippet to.
    1. Should the variable be 'tabber3'?
    2. What should the id value be?
    3. What should the tabclass value be?

    After that, what part of the code do I change to match those changes to make it work?

    Thank you very much for your help. It is greatly appreciated!

    HTML Code:
                           <div id="tab-container-1">
    					<ul id="tab-container-1-nav" class="tablayout">
    						<li>
    							<a href="#tab1">Assault Rifles</a>
    						</li>
    						<li>
    							<a href="#tab2">Light Machine Guns</a>
    						</li>
    						<li>
    							<a href="#tab3">Sub Machine Guns</a>
    						</li>
    						
    					</ul>
    					<div class="tab" id="tab1">
    						<div id="demo-nested" class="demolayout">
    							<ul id="demo-nested-nav" class="demolayout">
    								<li>
    									<a href="#">AK-47</a>
    								</li>
    								<li>
    									<a href="#">AUG</a>
    								</li>
    								
    							</ul>
    							<div class="tabs-container">
    								<div class="tab-nested">
    									<h2>AK-47</h2>
    									<p class="km-def"></p>
    								</div>
    								<div class="tab-nested">
    									<h2>AUG</h2>
    									<p class="km-def"></p>
    								</div>
    								
    							</div>
    						</div>
    					</div>
    					<div class="tab" id="tab1">
    						<div id="demo-nested" class="demolayout">
    							<ul id="demo-nested-nav" class="demolayout">
    								<li>
    									<a href="#">AK-47</a>
    								</li>
    								<li>
    									<a href="#">AUG</a>
    								</li>
    								
    								
    							</ul>
    							<div class="tabs-container">
    								<div class="tab-nested">
    									<h2>AK-47</h2>
    									<p class="km-def"></p>
    								</div>
    								<div class="tab-nested">
    									<h2>AUG</h2>
    									<p class="km-def"></p>
    								</div>
    								
    								
    							</div>
    						</div>
    					</div>
    				
    				</div>
    					
    			
    				<script type="text/javascript">
    					var tabber1 = new Yetii({
    						id : 'tab-container-1'
    					});
    
    				</script>
    
                                    <script type="text/javascript">
    					var tabber2 = new Yetii({
    						id : 'demo-nested',
    						tabclass : 'tab-nested',
    
    					});
    
    				</script>
    
                                    <script type="text/javascript">
    					var tabber3 = new Yetii({
    						id : '??',
    						tabclass : '??',
    
    					});
    
    				</script>

  2. #2
    Join Date
    May 2006
    Location
    Somewhere behind your screen
    Posts
    1,648
    in other words, you are looking for somebody who desires to write Yetii which fits these scripts (btw, why 3 scripts?!?!), then test it on your html, and finally give you the answer? or may be you think that everybody knows what Yetii is?
    xxx: Guess Buddhist riddle: "What is the sound of one hand clapping?"
    yyy: facepalm

  3. #3
    Join Date
    Apr 2012
    Posts
    9
    Quote Originally Posted by Padonak View Post
    in other words, you are looking for somebody who desires to write Yetii which fits these scripts (btw, why 3 scripts?!?!), then test it on your html, and finally give you the answer? or may be you think that everybody knows what Yetii is?
    I don't know. I figured it out using a round about method. Thanks though.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles