gJakeHollandd
New Member
I have some vertical tabs and i want to add more, but i want to add the to the right of the first vertical tabs. First ones are on the left and next to them there is the content box, well i want after this content box to be a new set of vertical tabs which will apply on the same content box. Here is an image with what i want ( i made it in photoshop ) :
Here is what I have tried: http://jsfiddle.net/26zQS/18/but i do not know how to change the jquery to work on both columnsHTML\[code\]<div class="verticalslider" id="textExample"> <ul class="verticalslider_tabs right"> <li><a href="http://stackoverflow.com/questions/15518072/#">1-right</a> </li> <li><a href="http://stackoverflow.com/questions/15518072/#">2-right</a> </li> <li><a href="http://stackoverflow.com/questions/15518072/#">3-right</a> </li> <li><a href="http://stackoverflow.com/questions/15518072/#">4-right</a> </li> <li><a href="http://stackoverflow.com/questions/15518072/#">5-right</a> </li> </ul> <ul class="verticalslider_tabs"> <li><a href="http://stackoverflow.com/questions/15518072/#">1-left</a> </li> <li><a href="http://stackoverflow.com/questions/15518072/#">2-left</a> </li> <li><a href="http://stackoverflow.com/questions/15518072/#">3-left</a> </li> <li><a href="http://stackoverflow.com/questions/15518072/#">4-left</a> </li> <li><a href="http://stackoverflow.com/questions/15518072/#">5-left</a> </li> </ul> <ul class="verticalslider_contents"> <li>Nothing</li> <li> <h2>Activitate 1</h2>ADI</li> <!-- elementul al doilea --> <li> <h2>Nunc Adipiscing</h2> <p>CUC adipiscing purus id orci rutrum placerat. Nam posuere elementum ipsum quis faucibus. Fusce fermentum turpis ac erat mollis sit amet varius mi placerat. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Ut ante justo, varius quis dignissim nec, condimentum in dui. Nulla sed lectus eu nunc vehicula vulputate vel nec velit. Integer eu purus nunc. Donec odio augue, sagittis pellentesque adipiscing id, dignissim vel enim. Maecenas a risus est.</p> </li> <li> <h2>Praesent Dapibus</h2> <p>Praesent dapibus metus vitae velit blandit tempor. Donec dignissim tempus neque, a vestibulum massa aliquam sed. Vestibulum velit quam, facilisis vel pharetra nec, bibendum eget mauris. In vitae ligula ac justo varius ullamcorper. Nullam vitae urna eu metus pellentesque vehicula vel sit amet nibh. Cras nec velit dictum neque imperdiet congue in nec eros. Suspendisse ante felis, eleifend sed pellentesque id, sagittis ut magna. .</p> </li> <li> <h2>Praesent Dapibus</h2> </li> </ul></div>\[/code\]jQuery\[code\]$(document).ready(function () { $("#textExample").verticaltabs({ speed: 500, slideShow: false, activeIndex: 0 }); $("#imageExample").verticaltabs({ speed: 1000, slideShow: true, slideShowSpeed: 3000, activeIndex: 0, playPausePos: "topRight" });});\[/code\]