Using jQuery UI Tabs. How would I make one of the tabs link to a URL rather than load a tab panel?

Viewed 16935

I am using jQuery UI tabs to create a vertical tab section of a page, and want the last vertical tab to link out to a URL rather than load a tab panel.

Any suggestions for the best way to do this? I can stick another element besides an LI into the list, but would rather have the last li just behave differently.

Thanks for any help.

Here's my javascript:

  // vtabs
  $("#aboutprod-tabs").tabs(
    { fx: [{opacity:'toggle', duration:'normal'},
    {opacity:'toggle', duration:'fast'}] })
    .addClass('ui-tabs-vertical'); 

And HTML

<div id="aboutprod-tabs">
  <ul>
    <li><a href="#tabs-1">First</a></li>
    <li><a href="#tabs-2">Second</a></li>
    <li><a href="#tabs-3">3rd</a></li>
    <li class="last"><a href="/products">Learn more...</a></li>
  </ul>
  <div id="tabs-1">
    Tab panel 1
  </div>
  <div id="tabs-2">
    Tab panel 2  
  </div>
  <div id="tabs-3">
    Tab panel 3
  </div>
</div>
2 Answers
Related