Uncaught TypeError: $(...).slick is not a function
Hello everyone.
I am currently working on a website kokolingo.hr
I have a slick-slider function inside of it which will create a slider with images: Slick slider
Now the issue is that right now, the slick-slider only breaks on Firefox and it looks like this MOST of the time: Broken slick slider
On top of that, while doing a force reload (CTRL + F5) it can sometimes load slick-slider without any issues and it doesn't throw an error. Both of the images were taken from Firefox itself.
How can I fix this? Most of the time people say that the libraries which make use of the slick-slider aren't loaded in correct order but they are.
If you need more information, simply ask what you need and I will try to deliver.
Matej
All Replies (6)
It looks like your slick library is not ready at the time of using it. Try to move this script to the header.
TyDraniu said
It looks like your slick library is not ready at the time of using it. Try to move this script to the header.
Nope, still doesn't work ://
I've managed to get it to work a few times with a normal refresh (F5) and then all the sliders work.
Odd timing issues can occur when script files are loaded from cache, but it's puzzling that the script is not recognized as having been read when hitting line 1990, the $(document).ready event handler. Or perhaps I should say that a different way: why is the script loaded and ready when bypassing the cache, but seldom ready when reloading the page from cache? It seems DOMContentLoaded (which I think is the event that jQuery .ready() hooks) has a different meaning for cached pages. ??
cor-el said
I've managed to get it to work a few times with a normal refresh (F5) and then all the sliders work.
That is what is bugging my mind the most. Why does it work sometimes and sometimes doesn't?
jscher2000 said
Odd timing issues can occur when script files are loaded from cache, but it's puzzling that the script is not recognized as having been read when hitting line 1990, the $(document).ready event handler. Or perhaps I should say that a different way: why is the script loaded and ready when bypassing the cache, but seldom ready when reloading the page from cache? It seems DOMContentLoaded (which I think is the event that jQuery .ready() hooks) has a different meaning for cached pages. ??
You might be onto something, I did edit my .htaccess file to cache/store JS files also. Maybe that is the issue? But again, in theory, wouldn't it then be the same for other browsers as well?
EDIT: Tried removing the .js extension so the cache wouldn't store .js files, but nothing changed sadly.
Modified by Matej