@kj3rra Not sure that @strawberry-3.141 will agree with the approach, but you can actually achieve the same thing with just CSS animations (and avoid creating a module).
Try either the following in your css/custom.css file:
/* this will cause the image to fade out for about 2 seconds every 2 minutes */
body{ animation: fading 60s infinite alternate; }
@keyframes fading {
0%, 98% { opacity: 1; }
100% { opacity: 0; }
}
- or -
/* this will cause the image to slide down, across 10px after 30 seconds, for 30 seconds, then back up */
body{ animation: slide 60s linear infinite alternate;}
@keyframes slide {
0%, 49% { transform: translate(0, 0); }
50%, 100% { transform: translate(10px, 10px); }
}
You can adjust the time value (i.e. 60s) to more/less as you like (but be careful, 2% of one hour is over 2 minutes). You can also adjust the percentages, and use decimal percents, like 0.5% if needed. CSS 2D transforms should not take too much memory or cause issues on an RPi. I assume that Chromium/Electron supports CSS 3 animations. YMMV.
