Firing Foundation 6 tab from multiple links -
is there way pull tab second link tab?
i have 2 tabs, links inside tabs-title work, want include link tab 2 inside tab-panel area of tab 1 - , vise versa.
you can use little javascript. add anchor content of tab 1 open tab 2.
<a href="#" onclick="$('#example-tabs').foundation('selecttab', '#panel2');">open tab 2</a>
here example using tabs docs panel choosers added.
<div class="row"> <div class="small-12 columns"> <ul class="tabs" data-tabs id="example-tabs"> <li class="tabs-title is-active"><a href="#panel1" aria-selected="true">tab 1</a></li> <li class="tabs-title"><a href="#panel2">tab 2</a></li> </ul> </div> <div class="tabs-content" data-tabs-content="example-tabs"> <div class="tabs-panel is-active" id="panel1"> <p><a href="#" onclick="$('#example-tabs').foundation('selecttab', '#panel2');">open tab 2</a></p> <p>vivamus hendrerit arcu sed erat molestie vehicula. sed auctor neque eu tellus rhoncus ut eleifend nibh porttitor. ut in nulla enim. phasellus molestie magna non est bibendum non venenatis nisl tempor. suspendisse dictum feugiat nisl ut dapibus.</p> </div> <div class="tabs-panel" id="panel2"> <p><a href="#" onclick="$('#example-tabs').foundation('selecttab', '#panel1');">open tab 1</a></p> <p>suspendisse dictum feugiat nisl ut dapibus. vivamus hendrerit arcu sed erat molestie vehicula. ut in nulla enim. phasellus molestie magna non est bibendum non venenatis nisl tempor. sed auctor neque eu tellus rhoncus ut eleifend nibh porttitor.</p> </div> </div> </div>
zurb foundation 6 selecttab method doc: http://foundation.zurb.com/sites/docs/tabs.html#selecttab
Comments
Post a Comment