Hi there!
I’m a designer, but a basic coder. I’d like my slideshow to end on the third slide. No loop.
I’ve found the pause() function… What’s the code to make it stop/land on a specific slide?
Thanks for any insight.
-Michael
Could you elaborate a bit more on what you try to achieve?
Meantime check the full functions list of the slideshow element.
Shay
Thanks for getting back to me Shay.
I’d like to run 3 slides, then stop/land on that last slide. No loop. I’ve turned to code because the normal galleries, slideshows and sliders options only have autoplay and loop. Unfortunately, I have a very basic understanding of code, so any insight would very helpful.
Thanks,
-Michael
Hi,
The code needs to pause the slideshow when it reaches the third slide.
Try using the following sample. Make sure you replace slideshow1 with your element ID you can locate in the properties panel .
$w.onReady(function () {
$w("#slideshow1").onChange((event, $w) => {
let currentIndex = event.target.currentIndex; // 3
if(currentIndex === 3){
$w("#slideshow1").pause();
}
});
});
Thanks for this Shay!
I’ve set it all up and it’s telling me ‘“onChange” is undefined’. What might I define it with.
Thanks again for your help.
Best,
-Michael
Hi,
Have you changed the “slideshow1” with your element’s ID?
Hello there Or,
I did. “gallery1”. Still telling me ‘“onChange” is undefined.‘ Thanks.
Since you use a gallery and not a slideshow use onCurrentItemChanged instead of onChange and get the index a bit differently. The code should look like.
$w.onReady(function () {
$w("#gallery1").onChange((event, $w) => {
let currentIndex = event.itemIndex; // 3
if(currentIndex === 3){
$w("#gallery1").pause();
}
});
});
Thanks for the suggestion. I tried it and now the code shows no error. However, it doesn’t stop on the 3rd slide either. Here’s the site:
And here’s a screen shot of the code.
Thanks,
-M
Any further ideas? They’d be much appreciated.
Thanks!
-M
You should change your code to ===2 and not 3.
That worked!
Except…
Now there’s an odd organization error. (See attached movie.) The first two slides placed in the CORRECT order (1-2-3) in the Image Gallery, previews as (2-1-3). When published, it only plays 1-3. Without the code, the slides STILL play out of order.
Ideas?
Thanks,
-M
Hi,
Looks like an issue with images order on our end, checking with developers.
Thanks Alexander. Looking forward to hearing your thoughts…!
No change with the images and their order on my end. Thoughts/insights? Thanks.
Are there any news? I’ve got exact the same problem. It doesn’t start properly at slide 1. Sometimes it starts at slide 1, sometimes it starts at slide 2 or 3. And sometimes it jumps directly to slide 2 and suddenly it changes to slide 1 and proceed correctly…
Hi mth,
It’s took time, but the solution is so simple. You just need to change the side of slides to be started - from right (in your case)
In the next screen you can define the sort - from the left to the right (added id’s on the bottom of each image)
*In the preview mode - it looks like playing “randomly”, because after each navigation to preview and back its stopped on different slide - and starts again from last stopped.
Thanks.
Does not work. It scrolls right past the slide. How to do this? I want my clients to be stopped on slide 3 where the next button to continue is present.
Hey there RNavi,
Follow this code, but obviously, add the name of your own slideshow:
$w(“#fullWidthSlides1”).onChange((event, $w) => {
let currentIndex = event.target.currentIndex; // 3
if (currentIndex === 2){
$w(“#fullWidthSlides1”).pause();
}
});
If you’re having any display order errors, read through the posts above.
Good luck!
-M
I have tried these various suggestions and none of them stop my slide show from looping. Seems like this should be a very common and simple option. HELP.
(1) On which SLIDE is the code placed; first or last? (2) On which EVENT is the code placed? (3) If my slide show is called “fullWidthSlides1” then what should the CODE be? Thank you!