@kiwisauthorJan 01.2021 — #Tried that, but the DIV's all hold their place. So when the 3rd is shown it's "down the page" a lot because the 2 previous ones wit opacity set to 0 still hold their place on the page.
@SempervivumJan 02.2021 — #I suspect that you intend to implement a cross fade effect, i. e. the div's take the same place and when the opacity changes one is being hidden and the other becomes visible? In this case you need to place one div by absolute positioning above the other.
Demo:
https://jsfiddle.net/Sempervivum/dcrzt6bu/
Feel free to modify it that way that the fading is controlling by javascript instead of CSS hover.