DockMenu + DropDownMenu = only 1 working. Help with noConflict();

programming web dev
1

Hi,
I’ve been doing html etc. for a long time, but never tried to use javascript to more than a single menu.
So the problem im having, is that im trying to make multiple javascripts working on the same html page. Ive spent the last few days trying to google my way to the solution, and most of the times i just end up with “you have to use this snippet:”

<!-- <script type=“text/javascript”>
var $ = jQuery.noConflict();
// Code that uses other library’s $ can follow here.
</script>–>

But i cant get it working, i always end up with just 1 of my javascripts working on my site. Ive tried to take only 2 of the javascripts out and make them work in a separate html document, to exclude any other interferring with it from other sources. But this gives teh same result in the end.

I bet this have a easy solution, and that im a newbie in it, but I just cant figure it out.
Here is the 2 codes i have:
Dropdown menu is everything before “<!–DOCK///////////////////////////////////
////////////////////////////////////////////–>”
the Dock menu is after that.

<!-- include jQuery Library From Google Code -->
<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.js"></script>

<!-- include jQuery UI  From Google Code-->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script>

<script type="text/javascript">

 $(document).ready(function() {

           
        $("div.blockeasing li.main").mouseover(function(){ //When mouse over ...
               //Following event is applied to the subnav itself (making height of subnav 60px)
              $(this).find('.subnav').stop().animate({height: '100px', opacity:'1'},{queue:false, duration:1500, easing: 'easeInOutQuad'})
        });
    
        $("div.blockeasing li.main").mouseout(function(){ //When mouse out ...
              //Following event is applied to the subnav itself (making height of subnav 0px)
              $(this).find('.subnav').stop().animate({height:'0px', opacity:'0'},{queue:false, duration:1600, easing: 'easeInOutQuad'})
        });

              
        //menu itembackground color animation            
        $("li").hover(function() {
              $(this).stop().animate({ backgroundColor: "#C13D93"}, 600);},
           function() {
              $(this).stop().animate({ backgroundColor: "#333333" }, 600);
        });
        
});
</script>



<!--DOCK///////////////////////////////////
////////////////////////////////////////////-->

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
    <script type="text/javascript" src="js/fisheye-iutil.min.js"></script>
    <script type="text/javascript" src="js/dock-example1.js"></script>

    <noscript>
        <style type="text/css">
            #dock { top: -32px; }
            a.dock-item { position: relative; float: left; margin-right: 10px; }
            .dock-item span { display: block; }
        </style>
    </noscript>


<!--DOCK END///////////////////////////////////
////////////////////////////////////////////-->

I hope there is someone that can help me.

Best regards
Daniel