I'm looking to use slick for my slider but for some reasons it won't work and I don't really know why. Everything seems fine but there's obviously a mistake which I hope someone can help me with.
<div class="cate_slider">
<div>
<p>Écologiste</p>
<?= $this->Html->image('euros2.png', ['alt' => 'Image Écologiste', 'class' => 'cate_mini'])?>
<p><span class="keyword">Pour retrouver la sérénité...</span><br>Détendez-vous, respirez pleinement aide à prendre conscience des éléments utiles qui vous entours. Laissez place au vide apaisera votre esprit.</p>
</div>
<div>
<p>Écologiste</p>
<?= $this->Html->image('euros2.png', ['alt' => 'Image Écologiste', 'class' => 'cate_mini'])?>
<p><span class="keyword">Pour retrouver la sérénité...</span><br>Détendez-vous, respirez pleinement aide à prendre conscience des éléments utiles qui vous entours. Laissez place au vide apaisera votre esprit.</p>
</div>
<div>
<p>Écologiste</p>
<?= $this->Html->image('euros2.png', ['alt' => 'Image Écologiste', 'class' => 'cate_mini'])?>
<p><span class="keyword">Pour retrouver la sérénité...</span><br>Détendez-vous, respirez pleinement aide à prendre conscience des éléments utiles qui vous entours. Laissez place au vide apaisera votre esprit.</p>
</div>
<div>
<p>Écologiste</p>
<?= $this->Html->image('euros2.png', ['alt' => 'Image Écologiste', 'class' => 'cate_mini'])?>
<p><span class="keyword">Pour retrouver la sérénité...</span><br>Détendez-vous, respirez pleinement aide à prendre conscience des éléments utiles qui vous entours. Laissez place au vide apaisera votre esprit.</p>
</div>
</div>
$(document).ready(function(){
$('.center').slick({
centerMode: true,
centerPadding: '60px',
slidesToShow: 3,
responsive: [
{
breakpoint: 768,
settings: {
arrows: false,
centerMode: true,
centerPadding: '40px',
slidesToShow: 3
}
},
{
breakpoint: 480,
settings: {
arrows: false,
centerMode: true,
centerPadding: '40px',
slidesToShow: 1
}
}
]
});
});
Ok I figured out where my problem was.
I add the slick css file not being loaded (how silly of me) it's now working.
Thx for the thoughts guys <3
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.