Fading out elements of a slideshow

Hello,

This is my first go at using Corvid (I’m a complete beginner when it comes to coding altogether) and I’m trying to get elements on a slideshow to fade out each time their specific slide reappears. Currently, I managed to do something like that for elements vectorImage1 and text2 using the following code but I feel there has to be a simpler way. Also, the fade-outs stop working entirely if the slideshow goes backward (say Slide 3 to 2 instead of 3 to 4).

Let me know your thoughts!

Thanks,
Zachary

export function vectorImage1_viewportEnter(event) {
//Add your code for this event here:
let $item = $w.at(event.context)

let fadeOptions = {
“duration”: 2000,
“delay”: 2000
};

$item("#vectorImage1").hide("fade", fadeOptions); 

$item("#text2").hide("fade", fadeOptions) 
} 

export function vectorImage2_viewportEnter(event) {
//Add your code for this event here:
let $item = $w.at(event.context)

let fadeOptions = {
“duration”: 2000,
“delay”: 2000
};

$item("#vectorImage1").show() 

$item("#text2").show() 

$item("#vectorImage2").hide("fade", fadeOptions) 

$item("#text3").hide("fade", fadeOptions) 

}