Cannot load Jquery or JQuerry.tabify

540 Views Asked by At

I need to create a tabbed menu on a Drupal website. The drupal installation is a good ould Drupal 4.7. In order to create tabbed menu I use tabify plugin for Jquery. The problem is that I cannot get it working. It seems that the Jquery doesn't load. I put the code (below) on the website where I would like to have the menu. It didnt work. Then I put it on the main drupal page and on every template file. Not working either. What is the cause of that? Any advice appreciated. Here is my code:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script src="jquery.tabify-1.4.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
        // <![CDATA[

        $(document).ready(function () {
            $('#tabbed_menu').tabify();
        });

        // ]]>
    </script>

<ul id="tabbed_menu">
        <li class="active"><a href="#description">Treatment</a></li>
        <li><a href="#usage">Prices</a></li>

        <li><a href="#download">FAQ</a></li>

    </ul>
    <div id="description" class="content">      
some text
</div>


        <div id="usage" class="content">
        <h2>Prices</h2>
some text           
</div>

    <div id="download" class="content">
some text
                        </div>

And CSS:

#tabbed_menu{   padding: 0;}#tabbed_menu LI{    display: inline;}#tabbed_menu LI A{ background: #EDF;   padding: 10px;  float: left;    border-right: 1px solid #CCF;   border-bottom: none;    text-decoration: none;  color: #000;    font-weight: bold;}#tabbed_menu LI.active A{    background: #E07;   color: #FFFFFF;}.content_tabbed{    float: left;    clear: both;    border: 1px solid #CCF; border-top: 1px solid #CCF; border-left: 1px solid #CCF;    background: #FFF;   padding: 10px 20px 20px;    width: 100%;    border-bottom: 1px solid #CCF;}
1

There are 1 best solutions below

2
On

its because the jquery u have loaded on is the core jquery, u need the jquery ui :) and make sure that <script> is above other codes where you call the tabify, :)