CODEWITHSUNDEEP
javascripthtmlcssflickity
billy ponto
billy ponto

Reputation: 61

Flickity-fade slider not working after following the installation docs from github; flickity just run like the regular slider

I'm following this flickity slide fade docs FlickityFade Installation

Here is the css cdn package

<link rel="stylesheet" href="https://unpkg.com/flickity@2/dist/flickity.min.css">
<link rel="stylesheet" href="https://unpkg.com/flickity-fade@2/flickity-fade.css">

Here is the carousel html and the script set up

<div class="testimonial-carousel">
     ....carousels div....
</div>

<script src="https://unpkg.com/flickity@2/dist/flickity.pkgd.min.js"></script>
<script src="https://unpkg.com/flickity-fade@2/flickity-fade.js"></script>
<script>
    $('.testimonial-carousel').flickity({
        // options
        fade: true,
        cellAlign: 'left',
        contain: true,
        prevNextButtons: false
    });
</script>

i don't figure out why this slide fade not working, only run in the dom like i am using normal flickity package but, it shown error like link below

Error screenshot from my console log

Upvotes: 3

Views: 1542

Answers (2)

Uzair Rashid Tak
Uzair Rashid Tak

Reputation: 83

Just Use fade v1 with filckity v2 :

here is the CSS:

<link rel="stylesheet"
      href="https://unpkg.com/flickity@2/dist/flickity.min.css"
    />
    <!-- CSS -->
    <link rel="stylesheet" href="https://unpkg.com/flickity-fade@1/flickity-fade.css">

here is the Js :

 <!-- Flickity js  JavaScript v2-->
<script src="https://unpkg.com/flickity@2/dist/flickity.pkgd.min.js"></script>

<!-- fade JS  v1-->
<script src="https://unpkg.com/flickity-fade@1/flickity-fade.js"></script>

Upvotes: 0

billy ponto
billy ponto

Reputation: 61

Found the solution here Flickity issues

Upvotes: 1

Related Questions