I’ve been working on a site lately that uses a lot of jQuery. I’m much more familiar with prototype so sometimes I find myself stumped at some of the problems I run into.
I had the site looking beautiful with superfish drop down menu and a nice side slider. Then I opened a page and suddenly superfish was throwing an error:
Error: jQuery("ul.sf-menu").superfish is not a function
My code looked like:
Javascript
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/superfish.js"></script>
<script type="text/javascript">
jQuery('ul.sf-menu').superfish();
</script>
What baffled me most was that it went from working to not working in zero-to-ten!
After fumbling and useless google searching I finally figured it out. For some reason it was calling the superfish() function before the js/superfish.js file was loaded. There’s an easy fix for that:
Javascript
<script type="text/javascript">
$(document).ready(function(){
jQuery('ul.sf-menu').superfish();
});
</script>
Tada! Easy to fix: using the ready function on the document.
This site runs on the Thesis WordPress Theme
If you're someone who doesn't understand a lot of PHP, HTML, or CSS, Thesis will give you a ton of functionality without having to alter any code. For the advanced, Thesis has incredible customization possibilities via extensive hooks and filters. And with so many design options, you can use the template over and over and never have it look like the same site.
If you're more familiar with how websites work, you can use the fantastic Thesis User's Guide and world-class support forums to make more professional customizations than you ever thought possible. The theme is not only highly customizable, but it allows me to build sites with a much more targeted focus on monetization than ever before. You can find out more about Thesis below:
{ 11 comments… read them below or add one }
nope, still the same (superfish 1.48 / typo3)
I had several trouble working with multiple JQuery. Thank you for the tip, I will keep that in my bookmarks.
Best,
This is a very good post, I discovered your weblog doing research bing for a similar subject and arrived to this. I couldnt come across to much other information and facts on this piece of content, so it was nice to discover this one. I probably will end up being back to check out some other articles that you have another time
Nice Post. Thanks for sharing this information with us.
Also had this issue, but this was not the problem, I had to put the jscript in footer which solved it..
@will could you post the code and where you put it to solve this issue? I for the life of me can not figure it out. CHeers.
My call to jQuery I left in the head, then the call to the superfish script and doc ready script I put just before the closing tag
… closing body tag, that meant to read.
谢谢,我的主题正是出现了这个问题!
If you are using tools of jquery it is included with the jquery framework, so no need to include it again only use the tools library , that will avoid the conflict problem.
Hey you guys!
I had the same error message … I couldn’t get Superfish to work properly.
“superfish is not a function” continued to show!! once and again ….
I realized that jQuery overriding made by superfish.js were not persistent … it just desappeared! …
Well … Here is the reason.
I was including a new instance of jQuery after the superfish.js library was included.
In the theme template.php script I was calling a new
so .. all overrides done were re-overriden!!!
And that’s the reason superfish were not working!
I hope this help you guys!
It helped me!
Cheers!
jjyepez[at]gmail.com