I’m using slick slider here and this error happens every time I click on the thumbnails… Checked that jquery was properly loaded before but other than that the slider works, I’m afraid I’m not expert on JS yet… this is what the console outputs
Uncaught TypeError: jQuery(...).slick is not a function
<anonymous> https://www.tomastestart.cl/portafolio/:500
jQuery 8
<anonymous> https://www.tomastestart.cl/portafolio/:491
Edit: this is the code: I should had posted this for starters
<script defer type="text/javascript">
// Slick Slider
jQuery('.center').slick({
centerMode: true,
centerPadding: '0px',
slidesToShow: 5,
arrows: false,
dots: true,
//adaptiveHeight: true,
responsive: [
{
breakpoint: 1308,
settings: {
arrows: false,
centerMode: true,
centerPadding: '0px',
slidesToShow: 3
}
},
{
breakpoint: 731,
settings: "unslick"
}
]
});
// Para clicks/hover
jQuery(document).on("mouseenter", ".slick-current", function(e) {
jQuery('.slick-current').addClass('current-hover');
});
jQuery(document).on("mouseleave", ".slick-current", function(e) {
jQuery('.slick-current').removeClass('current-hover');
});
// Para Touch
jQuery(document).on("touchstart", ".slide", function(e) {
e.stopPropagation();
if(jQuery(this).hasClass('current-hoverv2')){
jQuery(this).removeClass('current-hoverv2');
}
else{
jQuery(this).addClass('current-hoverv2');
}
});
jQuery('.slick-slider').on('click', '.slick-slide', function (e) {
e.stopPropagation();
const canHover = window.matchMedia('(hover: hover)').matches;
if ( canHover == true) {
jQuery('.slick-current').toggleClass('current-hover');
};
var index = jQuery(this).data("slick-index");
if (jQuery('.slick-slider').slick('slickCurrentSlide') !== index) {
setTimeout(function(){
jQuery('.slick-current').removeClass('current-hover');
}, 100);
jQuery('.slick-current').removeClass('current-hover');
//$('.slick-active .imagen-principal-portafolio').css({ 'height': '230px' });
event.preventDefault()
jQuery('.slick-slider').slick('slickGoTo', index);
jQuery('.slick-current').removeClass('current-hover');
// redimension imagen central del height basadao en width mas offset
//var customWidthv = $('.slick-current img').width();
//$('.slick-current .imagen-principal-portafolio').css({ 'height': 'calc(' + customWidthv+ 'px * 0.7 + 11px)' });
//$('.slick-current .imagen-principal-portafolio').css({ 'margin-bottom': '0px' });
}
});
</script>