I have recently been working on a project using jQuery UI tabs (http://jqueryui.com/demos/tabs/). After sifting through the documentation, I could not find any particular method for just calling the next tab in my own custom navigation. There is a lot of great events that you can hook into by creating callbacks, and a lot of great properties and methods; even one for selecting a tab. However, there is no nextTab() or next().
Well, here is nextTab() that works with UI Tabs:
<script type="text/javascript">
function nextTab(_tab_selector) {
var num_tabs = $('#tabs li',$(_tab_selector)).length;
var current = $(_tab_selector).tabs('option','selected');
var next = ((current + 2)>num_tabs) ? 0 : current + 1;
$(_tab_selector).tabs('select',next);
}
</script>
This function will continue through a tab system until it reaches the end and continue to the beginning. Simply call it from your own custom link such as:
<a href="javascript:" onclick="nextTab('#mytabs');">Next Tab</a>
Or, you could bind them to the click event of a class selector:
<a href="#mytabs" class="next-tab">Next Tab</a>
<script type="text/javascript"> $('.next-tab').bind('click', function() { nextTab($(this).attr('href')); }); </script>
Of course, you could easily create a previous tab method by modifying the increments to decrements. You could even create some custom callback events that could be triggered. However, this is a minimalistic nextTab method that does it's job just fine. Happy coding
Nevermind Roger, I figured it out. Thank you SO MUCH for posting this information. It helped me out so much.
Tyson.
Hello Roger. Thank you for posting this; I have been looking far and wide for info about how to add next and previous links to the jquery tabs. I am a newbie to jquery so don't know much about it but am trying to get this work for me. I'm wondering what parts of this code do I need to customize? I tried to post my code but it doesn't display correctly. If you would like to take a look at it I would appreciate it; I'm sure there are some things I'm missing. Again, thanks for any help you could lend.
Tyson.
Hey Felicia, very much a late reply...
I don't use viviti for domains. But I use it for my website / blog hosting. I use bravenet.com for domain hosting and I am able to point my domains to my viviti account.
Hi! just wondering if you use viviti.com as your domain host?