Glide.js script only working inside the console

Asked Mar 15 '22 at 15:19

Active Mar 15 '22 at 15:19

Viewed 126 times

I am using Glide.js to display sliders on my website. To display one slide, I am using the following code:

document.querySelector(".resources-carousel") &&
((resourcesCarousel = new Glide(".resources-carousel", { 
  type: "slider", 
  perView: 4, 
  gap: 20 
})),
resourcesCarousel.mount());

On another page, I would like to display multiple sliders using this code:

var resourceSliders = document.querySelectorAll('.resources-carousel');
for (var i = 0; i < resourceSliders.length; i++) { 
    var glide = new Glide(resourceSliders[i],{
        type:"slider",
        perView:4,
        gap:20,
    });
    glide.mount();
}

The code works fine and initialises both sliders when pasted in to the console, however when I add this code to my scripts.js file in Wordpress I get the following error:

Uncaught SyntaxError: Unexpected token 'var'

How can I fix this?

asked Mar 15 '22 at 15:19

threeedv

where are you seeing this error? – mikerojas Mar 15 '22 at 17:06
In the console when I publish the changes. It also breaks all other scripts inside script.js – threeedv Mar 15 '22 at 17:21
are you compiling your scripts at all? – mikerojas Mar 15 '22 at 17:21
Yes it is all compiled inside one file – threeedv Mar 15 '22 at 17:26

Glide.js script only working inside the console

0 Answers0