JQuery Tools: tabs – targeting tabbed content from external link conundrum

I’m implementing http://cdn.jquerytools.org/1.2.7/all/jquery.tools.min.js in wordpress for homepage tabbed content. But, I’m having a problem with targeting specific tabs outside the homepage itself. I have the tabbed menu loaded into the header section for easy access from any page on the site, but no matter what, all three links default to the #first div content, even though it shows the correct # target in the address bar. I don’t have JQuery called in the head and only on the homepage where the tabbed content lives.

Here’s my code in the home.php

Read More
  <div>
<div class="panes">
                <div id="first">

                </div>
                <div id="second">

                </div>
                <div id="third">

                </div>
</div>
<script>
                jQuery(function() {
                jQuery("ul.tabs").tabs(".panes > div", {effect: 'fade'});
                </script>
</div>

and here’s my menu externally in my functions.php file

echo '<div id="custom-nav">';
                echo  genesis_do_nav();
                echo '<div id="header-tab-wrap">
                    <ul class="tabs">
                        <li>
                            <a id="t1" href="http://www.site.net/#first">Home</a>
                        </li>
                        <li>
                            <a id="t2" href="http://www.site.net/#second">Aero Systems Engineering</a>
                        </li>
                        <li>
                            <a id="t3" href="http://www.site.net/#third">Aero BridgeWorks</a>
                        </li>
                    </ul>
                </div>';
            echo '</div>';

Related posts

Leave a Reply