Links Won't Open When Using Multiple Tabs (Jquery Tabs) -
code multiple tabs on page (displaying these tabs , content dynamically):
jquery('.tab-block li a').click(function() { var theitem = jquery(this); theitem.parent().parent().find("li").removeclass("active"); theitem.parent().addclass("active"); theitem.parent().parent().parent().parent().find(".tab-content > ul > li").removeclass("active"); theitem.parent().parent().parent().parent().find(".tab-content > ul > li").eq(theitem.parent().index()).addclass("active"); return false; });
code in html display tabs:
<div class="tab-block"> <div class="tabs"> <ul> <li class="active"><a href="#">tab 1</a></li> <li><a href="#">tab 2</a></li> </ul> <div class="clear-float"></div> </div> <div class="tab-content"> <ul> <li class="active"> <p><h3><a href="http://www.google.com/" rel="nofollow" target="_blank">goole.com</a></h3></a> <p>content</p> </li> <li> <p><h3><a href="http://www.google.com/" rel="nofollow" target="_blank">goole.com</a></h3></a> <p>content</p> </li> </ul> </div> </div>
now tabs work great no links open (the h3 link within tabs themselves). ideas i'm doing wrong? thank you.
i don't know specific problem is, may want provide link jsfiddle, make clear, if need tabs, try ez tabs jquery plugin.
html:
<div class="tab-block"> <div class="tabs"> <ul class='nav'> <li>tab 1</li> <li>tab 2</li> </ul> <div class="clear-float"></div> </div> <div class="tab-content"> <div class='box'> <p> <h3><a href="http://www.google.com/" rel="nofollow" target="_blank">goole.com</a></h3> </a> <p>content</p> </div> <div class='box'> <p> <h3><a href="http://www.google.com/" rel="nofollow" target="_blank">goole.com</a></h3> </a> <p>content</p> </div> </div> </div>
jquery, on document ready:
$('.tab-block').eztabs({ tabslist : 'ul.nav', animation: 'slideleftright', boxcontainer: '.tab-content', animationtime: 200 });
Comments
Post a Comment