html - JQuery tabs system -
wrote script , seems ok me reason jquery doesnt want work. been trying work ages no luck. if wouldnt mind skim on me. apologise if missing simple eyes glazed lol.
heres html & php
<ul class="tabs"> <li class=""><a href="#about">about</a></li> <li class=""><a href="#contact">contact <?php echo $retailers['retailer']['company'];?></a></li> </ul> <div class="tab_container"> <div id="about" class="tab_content"> <h3>about <?php echo $retailers['retailer']['company'];?></h3> <p><?php echo $retailers['retailer']['description'];?></p> </div> <div id="contact" class="tab_content"> <h3>contact <?php echo $retailers['retailer']['company'];?></h3> <h4>email <?php echo $retailers['retailer']['company'];?></h4> <p><?php echo $retailers['retailer']['email_address'];?></p> <h4>phone <?php echo $retailers['retailer']['company'];?></h4> <p><?php echo $retailers['retailer']['phone'];?></p> <h4>fax <?php echo $retailers['retailer']['company'];?></h4> <p><?php echo $retailers['retailer']['fax'];?></p> <h4>write <?php echo $retailers['retailer']['company'];?></h4> <p><?php echo $retailers['retailer']['address_line_1'];?>,<br /><?php echo $retailers['retailer']['address_line_2'];?>,<br /><?php echo $retailers['retailer']['city'];?>,<br /><?php echo $retailers['retailer']['county'];?>,<br /><?php echo $retailers['retailer']['postcode'];?></p> </div> </div>
heres jquery:
<script type="text/javascript" language="javascript"> $(document).ready(function() { //default action $(".tab_content").hide(); $("ul.tabs li:first").addclass("active").show(); $(".tab_content:first").show(); //on click event $("ul.tabs li").click(function() { $("ul.tabs li").removeclass("active"); $(this).addclass("active"); $(".tab_content").hide(); var activetab = $(this).find("a").attr("href"); $(activetab).fadein(); return false; }); }); </script>
sorry cant give link on local machine.
thanks folks
jamie
i suggest take @ offictal jquery ui documentation, in particular tabs page. think markup has errors, how this:
<div id="tabs_container"> <ul> <li class=""><a href="#about">about</a></li> <li class=""><a href="#contact">contact <?php echo $retailers['retailer']['company'];?></a></li> </ul> <div id="about" class="tab_content"> <h3>about <?php echo $retailers['retailer']['company'];?></h3> <p><?php echo $retailers['retailer']['description'];?></p> </div> <div id="contact" class="tab_content"> <h3>contact <?php echo $retailers['retailer']['company'];?></h3> <h4>email <?php echo $retailers['retailer']['company'];?></h4> <p><?php echo $retailers['retailer']['email_address'];?></p> <h4>phone <?php echo $retailers['retailer']['company'];?></h4> <p><?php echo $retailers['retailer']['phone'];?></p> <h4>fax <?php echo $retailers['retailer']['company'];?></h4> <p><?php echo $retailers['retailer']['fax'];?></p> <h4>write <?php echo $retailers['retailer']['company'];?></h4> <p><?php echo $retailers['retailer']['address_line_1'];?>,<br /><?php echo $retailers['retailer']['address_line_2'];?>,<br /><?php echo $retailers['retailer']['city'];?>,<br /><?php echo $retailers['retailer']['county'];?>,<br /><?php echo $retailers['retailer']['postcode'];?></p> </div>
you need div contains tab divs , list various links, missed in code. in jquery code you're missing call .tabs() creates tabs. here how assuming using previous markup posted:
$('#tabs_container').tabs()
Comments
Post a Comment