In this lesson, we will be using Multi-State Boxes to create an automated slideshow. Have a custom slideshow that automatically go through the slides without then need for users to press buttons.
Before you copy the code, we suggest you watch our video to make sure that you set up your slideshow correctly on your website:
$w.onReady(function () { var states = ['box2', 'box1']; var stateNumber = 0; function slideShow() { $w('#multiStateBox1').changeState(states[stateNumber]); if (stateNumber<states.length - 1) { stateNumber++; } else { stateNumber = 0; } setTimeout(slideShow,6000); } slideShow(); });
In order for this code to work, you must make sure you either change the name of your multi-state box to "multistatebox1" or change the code to match what name you have given the element. Same goes for the states in your multi-state box.
Have fun!
If you need assistance with setting up your Velo code, then we can help you out! Just click here to receive help.