CODEWITHSUNDEEP
javascriptjqueryslick.js
Najib TAHAR-BERRABAH
Najib TAHAR-BERRABAH

Reputation: 81

Uncaught TypeError: $(...).slick is not a function

I'm trying to do a carousel with slick but it doesn't work.

This test code work well:

<script  src="jquery.min.js"></script>
<script  type="text/javascript" src="slick/slick.min.js"></script>
<script>
$('.slider').slick({
  slidesToShow: 1,
  slidesToScroll: 1,
  dots: true,
  infinite: true,
  cssEase: 'linear'
});
</script>

But this code don't work and reply me $(...).slick is not a function :

<script src="js/noframework.waypoints.min.js"></script>
<script src="js/logo-appear.js"></script>
<script src="js/skill.js"></script>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="slick/slick.min.js"></script>
<script type="text/javascript">
$('.experiences').slick({
  slidesToShow: 1,
  slidesToScroll: 1,
  dots: true,
  infinite: true,
  cssEase: 'linear'
});
</script>

I tried to update the version of jQuery, to insert $(document).ready(function(){});

I'm not really good with jQuery, maybe there is a conflict with waypoint.

Thanks for your help.

Upvotes: 2

Views: 13791

Answers (2)

GMKHussain
GMKHussain

Reputation: 4719

Avoid to jQuery slim version.

Cross check how many jQuery being loaded

Upvotes: 0

Ed Lucas
Ed Lucas

Reputation: 7355

You do need to guarantee that the Slick library is loaded before you try to use the slick() function. You were on the right track by considering the need for to wait until the document is "ready", as that will ensure that the Slick and jQuery libraries have been fetched. You can use the jQuery $() shorthand to check this:

$(function() {
    $('.experiences').slick({
        slidesToShow: 1,
        slidesToScroll: 1,
        dots: true,
        infinite: true,
        cssEase: 'linear'
    });
});

Upvotes: 1

Related Questions