Custa1200
12 years agoHelper
Tabs example
Has anybody got an example which shows how to hook up some tabs in a custom component using the markup from Lithiums other instances of tabs?
Sign in to react to this post
Has anybody got an example which shows how to hook up some tabs in a custom component using the markup from Lithiums other instances of tabs?
initially tried to copy the markup just to see if I could get it going from the New Post tabs and added a @liascript function call that I found at the bottom from the new post page but have had no luck.
<@liaAddScript>
LITHIUM.TabGroup('#tabgroup', '.lia-tabs', '.lia-tabs-content', 'LITHIUM:changeTab', 'tabName', false, false);
</@liaAddScript>
<div id="tabgroup" class="lia-tabs-standard-wrapper">
<ul class="lia-tabs-standard">
<li class="lia-tabs rich-tab lia-tabs-active">
<span><a class="lia-link-navigation rich-link tab-link lia-custom-event" id="link_2" href="#">Recent Posts</a></span>
</li>
<li class="lia-tabs html-tab lia-tabs-inactive">
<span><a class="lia-link-navigation html-link tab-link lia-custom-event" id="link_3" href="#">Recent Solutions</a></span>
</li>
<li class="lia-tabs preview-tab lia-tabs-inactive">
<span><a class="lia-link-navigation preview-link tab-link lia-custom-event" id="link_4" href="#">Featured Posts</a></span>
</li>
</ul>
</div>
<div class="recent-posts">
Recent Posts code goes here.
</div>
<div class="recent-solutions lia-js-hidden">
Recent Solutions code goes here.
</div>
<div class="featured-posts lia-js-hidden">
Featured Posts code goes here
</div>
Hi Custa1200
what is exactly the use case / journey that you are trying to achieve? Have you considered using libraries such as jQueryUI Tabs?
Hope this helps,