Tablooper: Prevent Tab from moving to 1st postion

19-Oct-2015 10:41:25

Purchased Tablooper and I love the product. I'm trying to figure our how to eliminate the tab from moving to the first position. Is there certain JavaScript code that I can just comment out?

19-Oct-2015 18:23:54

Hi,

If you want to prevent tab buttons move to the first left position you need to edit Javascript file.

Open "tablooper.dev.js" file in "/js" folder, find "SetActiveTab($curView, $newView)" function. In this function you can comment these lines:

Line 96:

$tabholder.find('.loop-tab').eq(0).appendTo($(e).find('.loop-tabstation'));

Line 101:

$prevtabs.appendTo($(e).find('.loop-tabstation'));

Line 106:

$prevtabs.appendTo($(e).find('.loop-tabstation'));

Note: Because this function is a main feature of the plugin so changing it may cause some issues. In the case you have many tab buttons on a small screen, you may not see an active tab button at the right. It is the reason I have to move the active tab button to the first left position.

Next time, please do not show/share your purchase code on public sites. Just use the "Add License" feature on this system to add your purchase code.

Kind regards.

20-Oct-2015 14:11:30

Thanks for the quick reply. Sorry about putting the purchase code in there. Commenting out those lines of code does prevent the tab from moving to the first position, however, when you slide or click on any other tabs it shows the content from the first content-zone on all of them.

20-Oct-2015 21:59:26

For the content zone issue, you can try to change these lines:

1. Find "HideTabContent($curView, $newView)" function, then replace:

$tabid = $tabholder.find('.loop-tab').eq(0).attr('data-tabid');

by:

$tabid = $tabholder.find('.loop-activetab').attr('data-tabid');

2. Find "ShowTabContent($view)" function, then replace:

$tabid = $tabholder.find('.loop-tab').eq(0).attr('data-tabid');

by:

$tabid = $tabholder.find('.loop-activetab').attr('data-tabid');

3. Find "NextTab()" function, comment or remove this line:

$tabholder.find('.loop-tab').removeClass('loop-activetab');

4. Find "PrevTab()" function, comment or remove this line:

$tabholder.find('.loop-tab').removeClass('loop-activetab');

That's it. You can save the file and test again.

Sorry for the inconvenience!

Kind regards.

21-Oct-2015 11:52:18

Fantastic! It works great. Thanks again for the prompt replies.