jQuery SuperFish Error: jQuery("ul.sf-menu").superfish is not a function

Question

I am having problems with my superfish drop down menu - it was working fine before i added the jQuery.Columnizer to my project. Taken out the columnizer jQuery fixes the problem for the superfish.js - however when both are enabled and running the drop down menu is displayed when you hover over the menu but when you try clicking on the menu link in the dropdown the dropdown disappears. I cant seem to fix this problem - i've googled around and followed various advice and examples but to no avail.

I am using the columnizer to split up my content in to like 3 columns. Is the problem because i am referencing 2 jquery libraries?

Superfish.js

<link href='http://fonts.googleapis.com/css?family=PT+Sans' rel='stylesheet' type='text/css' />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<link href="/assets/css/main.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="/assets/css/superfish.css" media="screen" />
<script type="text/javascript" src="/assets/js/hoverIntent.js"></script>
<script type="text/javascript" src="/assets/js/superfish.js"></script>
<script type="text/javascript" src="/assets/js/jquery-1.2.6.min.js"></script>

  <script type="text/javascript">
      // initialise plugins
      $(document).ready(function () {
          jQuery('ul.sf-menu').superfish();
          //alert("hello i am working... maybe or maybe not!");
      });
</script>

Columnizer.js

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script src="/assets/js/jquery.columnizer.min.js" type="text/javascript"></script>

<script type="text/javascript">
$('#wrapper').columnize();
$('.wide').columnize({ width: 200 });
</script>

UPDATE: Here is the solution to the problem;

<add key="**********.*********.***.JQuery.Path" value="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"/>

taking out both the previous references and updating it with the latest CDN ensured it was working perfectly - i referenced the .JS in my webconfig and then code behind page. Phew.. working now - thanks for all your help people.

Answer 1

you are adding jquery twice remove this line

<script type="text/javascript" src="/assets/js/jquery-1.2.6.min.js"></script>

or if you need to include two versions of jquery on the same page because of plugin support refer to this answer

https://stackoverflow.com/a/528251/413670

EDIT

if your plugins support the jquery version try this

<link href='http://fonts.googleapis.com/css?family=PT+Sans' rel='stylesheet' type='text/css' />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<link href="/assets/css/main.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="/assets/css/superfish.css" media="screen" />
<script type="text/javascript" src="/assets/js/hoverIntent.js"></script>
<script type="text/javascript" src="/assets/js/superfish.js"></script>
<link href='http://fonts.googleapis.com/css?family=PT+Sans' rel='stylesheet' type='text/css' />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<link href="/assets/css/main.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="/assets/css/superfish.css" media="screen" />
<script type="text/javascript" src="/assets/js/hoverIntent.js"></script>
<script type="text/javascript" src="/assets/js/superfish.js"></script>
<script src="/assets/js/jquery.columnizer.min.js" type="text/javascript"></script>

<script type="text/javascript">
      // initialise plugins
      $(document).ready(function () {
          jQuery('ul.sf-menu').superfish();          
          $('#wrapper').columnize();
         $('.wide').columnize({ width: 200 });

      });
</script>