Streaming live at 10am (PST)

Animations not working on second loop of slider?


#1

Hi,

I have created a fullpage slider with custom animation to transition between slides. It is working fine but the animations are not triggered on the loops of the slides after the first set.

Also I have a page load animation (large J symbol in thin white in centre of screen) which I want to loop after page load but it only triggers the animation once.

Any help would be much appreciated!

https://preview.webflow.com/preview/jsd-test-website?preview=2a903afa6a2d37c143c04d95ddaf6cc8


#2

Hi, I didn’t get a response to this but just in case this post is found by someone later with a similar problem I will reply to it myself!

After MUCH trial and error I am coming to the following conclusions (chime in here any webflow experts if this makes sense or you have a comment!)

The preview in the OP is gone but essentially I had a slider with full screen images on each slide presented in 4 vertical slices. Each slice was animated to hide the full picture before moving to the next slide. My problem was that the slider was not looping properly.

I have been working on a test which is working at the moment and I am going to apply it now to my main design. The problem I was having seems to be related to using combo classes and the slide not reinstating the “initial state” for the elements in the animation so that when the second loop of the slider happened it was not starting again from an “initial state”. I read a post that mentioned that this was also the case for Page Load animations.

So to get around this I added an animation step for each element at the end of the animation (with a time of 0) to return the elements to their original state.

In relation to combo states, as an example I had “Segment A” which was in each slide with identical properties, I had also added a combo class to identify the slide for example “Lion” so the combo states for the element were “Segment A/Lion” next slide “Segment A/Flower” etc for all of the slides.

Essentially there was no need for the combo class and whatever way it translates into code in the background seems to cause confusion, however when I removed the combo class and just used the main class the animation seems to loop and work okay.

Now to try it with the real deal which is a more complex animation than my test.