Hey,
I have implemented a carousel and wanted to make it automatically slide. That succeeded thanks to the help of this thread:
I found this thread which helped (the 'but' will follow soon):
and used this piece of javascript in the header code injection
<script>
window.onload = function() {
var nextArrow = document.querySelector(".summary-carousel-pager-next");
function clickNext() {
nextArrow.click();
}
setInterval(clickNext, 3000);
};
</script>
My next issue was that I wanted to control the time that it takes to rewind the carousel. I did this by changing the code to this:
window.onload = function() {
let nextArrow = document.querySelector(".summary-carousel-pager-next");
let prevArrow = document.querySelector(".summary-carousel-pager-prev");
let clickCount;
function clickNext() {
nextArrow.click();
clickCount++;
};
function goBack(){
clickCount = 0;
prevArrow.click();
prevArrow.click();
};
function clickHandler(){
console.log(clickCount);
if(clickCount <= 2){
clickNext();
}else{
goBack();
}
};
setInterval(clickHandler, 3000);
};
The problem is that this works, but it forces the page to go into edit mode somehow. By reading some more threads I came to the conclusion that I would have to have this code only execute outside of edit mode. I found this thread:
The problem now is that I have no idea how to make this work with code injection. Where should I place these lines? Is the code I'm using a proper way of handling this in the first place?