Can someone take a look and tell me if this is possible with the SD5 software.

In the footer I have an image of a half a sawblade and I currently have it animated to rise up when that area of the page is scrolled into view. I like my delay & duration. I simply used the out-of-view state and a negative bottom margin. I'm happy with all of it. But.....

I'd like to know if there is a way I can make it go back down & back up again every few seconds?
After it appears, in about 5 more seconds I'd like it to go back down and then up again, and then waits 5 seconds and do it all over again, and indefinitely until it is scrolled out of view or the page is exited.

If I have to use attributes then someone will need to carefully explain exactly what I need to do since I have no experience with those yet. Hopefully there is a simple way.

Hi Chris
I think it might only be possible with some custom animation, rather than out of view, but I can take a look see.

How about using an animated gif?

I haven't been able to make it go up & down but I have done something with some custom CSS,
It still requires some tweaking but have a look here
and see what you think
https://youtu.be/b4jIZDr77JA

ps it required a new image

Wayan,
That's great! I was starting on what Eric suggested (a GIF) and had just created a new image and was about to start making many frames to turn it into a GIF. And I had that same idea you had - to make it spin. But I was going to achieve that in the GIF creation.

So I would like to know how you did that or get a copy of the file/image. Because I do think it's cool that it spins. But I really want it to go up & down on it's own indefinitely if anyone knows how that's possible (beside doing a GIF).

The problem is that when it's "IN VIEW" it's no longer "OUT OF VIEW" so the animation has already fired and it cannot be repeated without using custom CSS instead of "Out OF VIEW"

To do something with custom CSS is going to need a number of containers with the image in, then apply the different custom animation CSS to the containers, I am still trying to get a smooth effect.

So a Gif that looks like it goes up & down although a larger file, would probably be just as quick and effective

That's what I'm working on now. It takes a while to make all the pics it takes to have it spin and go up & down. But I'm about 1/3 of the way done with it. I hope it works ok.

I've never made one or saved one on my computer before. Will I be able to save the GIF in my SD Resources so my site is getting it locally? I hate linking to things stored elsewhere because if something happens with that other server then my GIF ends up missing.

Thanks for all your efforts Wayan!

Yes you can save gif images in resources

should you wish to rotate a plain image here is the custom CSS required
place it in the header
give the image a class= rotate

<style>.rotate {
animation: rotation 4.5s infinite linear; /*this is the speed of the animation, you can alter it */
}
@keyframes rotation {
from {
transform: rotate(0deg);
}
to {
transform: rotate(359deg);
}
}
}</style>

This is the CSS for the container holding the image to make it move up & down

<style>
.updown {
animation: MoveUpDown 4s linear infinite; /* you can adjust the speed of the animation */
position: absolute;
left: 0;
bottom: 0;
}

@keyframes MoveUpDown {
0%, 100% {
bottom: 0;
}
50% {
bottom: 100px;
}
}</style>

You will need to play with the position depending on container position

I am going to be off air for a day or so as I am having my own dedicated WIFI antennas installed (finally took the plunge, after almost a year using a rubbish WIFI connection on my phone)

Thanks for all the info Wayan! I will definitely use that!
I got the GIF done and it works. I'm happy with it.
Thanks Wayan and Eric for all your help!!!