Implementing tabs into in existing HTML structure.
Hi guys,
I'm trying to implement tabs into my web app but the <ul> and my
<divs> are not direct children of my wrapper div.
According to the documentation this is how I need to be structured:
<div id="wrapper">
<ul>
<li><a href="#1">1</a></li>
<li><a href="#2">2</a></li>
</ul>
<div id="1">Bla</div>
<div id="2">Bla</div>
</div>
Now, the html of my app (for each section) looks like this:
<div class="section" id="tabs">
<div class="section-info">
<div class="section-title">
<h3>Smartphone</h3>
</div>
<ul>
<li><a href="#section-1">Change Phone</a></li>
<li><a href="#section-2">Reset Activation</a></
li>
<li><a href="#section-3">Edit Account</a></li>
<li><a href="#section-4">Delete Account</a></li>
</ul>
</div>
<div class="section-inner">
<div id="section-1"><br />TEST 1<br /></div>
<div id="section-2"><br />TEST 2<br /></div>
<div id="section-3"><br />TEST 3<br /></div>
<div id="section-4"><br />TEST 4<br /></div>
</div>
</div>
You can see the ul I want to use, and the 4 divs associated with them,
but since my app doesn't layout as the widget requires, nothing
happens when i apply the tabs() class to #tabs.
My question is: Can i specify the ul and divs i want it to control,
how can I modify the tabs script to work with my implementation?