Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trialWilson Usman
35,206 PointsUncaught TypeError: $(...).sticky is not a function
I've run out of ideas here. I keep getting the same error no matter what I do.
$(document).ready(function() {
$('.header-container').sticky();
});
I have jquery.js file before the sticky.js file also.
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="http://example.com/js/jquery.sticky.js"></script>
Here's the full browser error:
(anonymous function) @functions.js:241
j @functions.js:2
k.fireWith @functions.js:2
m.extend.ready @functions.js:2
J @functions.js:2
6 Answers
Nate Jonah
20,981 PointsI had this same problem. I solved it by using the latest versions of jQuery (3.2.1) and Sticky (1.0.4) instead. In the video (and in the project files), Dave uses jQuery 1.11.2 and Sticky 1.0.0, which by now are couple of years old at least.
<script src="http://code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="js/animsition/jquery.animsition.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.sticky/1.0.4/jquery.sticky.js"></script>
<script src="js/main.js"></script>
I used cdn but you could download the files and add them to your project folder, obviously.
I Hou Tong
6,936 Pointshttp://mysite.com/js/jquery.sticky.js
Not sure if you're trying to hide your actual site domain or not but that ends up giving a 404 error. sticky.js is never loaded because you're pointing to a source that doesn't exist.
Wilson Usman
35,206 PointsYes, it's a private website I'm working on.
I Hou Tong
6,936 PointsHmmm. Then these are the only other things that I can think:
1) Did you double check your file path? 2) Since it's on a private website, are the file permissions set properly? 3) You can also try using https://api.jquery.com/jquery.getscript/. You shouldn't load the script that way but you can see if sticky.js is being loaded at all.
Wilson Usman
35,206 PointsI Hou Tong Looks like I solved the problem. When I reversed the javascript files it worked. I don't know why, but it does. I thought based on the tutorial, jquery should come before sticky, but not in my case.
I wonder if there's something else broken on my code.
I Hou Tong
6,936 PointsGlad you got it to work, but something is definitely wrong. sticky.js seems to be a jQuery plugin which means it would require jQuery to be included first before including sticky.js. Only way it would work is if you have jQuery included elsewhere, before you include sticky.js.
Michael Hernandez
9,746 PointsI am having the same problem. I am using the workspace provided and have even tried moving on to the next video where the workspace is correctly filled in and it still won't work.
Michael Stolp-Smith
4,855 PointsI am having the same problem. Checked syntax and everything. This isn't working.
Anusha Lee
Courses Plus Student 14,787 PointsAfter two years, I still face the same problem. The sticky header is not working.
Marc-Oliver Gern
8,747 PointsMarc-Oliver Gern
8,747 PointsHi Wilson, It happend to me as well. Same error message until I replaced all the script links in the html files with: