jquerywordpressflickity

Uncaught TypeError: jQuery(...).flickity is not a function

So I was trying to add flickity to my website with this code here:

jQuery('.main-carousel').flickity({
  // options
  cellAlign: 'left',
  contain: true
});

It was working yesterday but for some reason today the slider won't work at all and I don't know why. Here is my website for reference : https://fitnesslore.dreamhosters.com/

I have tried every tutorial on the internet and nothing has worked so far.

Solution

  • I think this is due to the defer attribute on your flickity script: enter image description here

    your slider init code is inline in the head tag and fires as soon as its seen. because of the defer flickity is not available to your init call until the page is done loading. Either remove the defer or wrap your init code in a dom ready call like below:

    jQuery(document).ready(function(){
    jQuery('.main-carousel').flickity({
    // options
    cellAlign: 'left',
    contain: true
    });
});

    here you can see if I re-add your init call in dev tools after the page has loaded the slider works:

    enter image description here