looping animation out of view

This is probably a novice question …
im using css rotate to make a few elements infinite loop on the Hero section of a home page.
considering page performance, are the animations still effect when the page is scrolled down- so the animations
are no longer visible?
If so, should i stop the loop when scrolled out of view or even use Display:none?
maybe Opacity:0 so i wont effect the DOM.
Does the same apply to looping GIFs or background videos?

Also in #CSS _↴