Hide & Show Elements

Hi, at the bottom of my homepage ( https://www.cprfatraining.com ), I ripped off the code from WiX here: https://www.wix.com/code/home/example/Hide-and-Show-Elements and modified it for my use. I have mine setup on a slideshow so that I can move to the next slide once the action is complete. I want to call $w(‘#SlideShowFind’).changeSlide(1); once all four elements (#Mask, #Defib, #Gloves, #Dummy) are inside the backpack. I can’t seem to figure out if it’s possible to watch all four elements and when they are all inside (#MaskInside, #DefibInside, #GlovesInside, #DummyInside) then I want to advance the slide by using $w(‘#SlideShowFind’).changeSlide(1);

Any help or insight toward the right direction is appreciated!

Nice site :-), What you can do is just add new function that will be called from all the relevant onClick and just add there the check that all the components in the bag are show and then move to the next slid.
Example:
function checkSwitchToNextSlide(){
if (!$w(“#DummyInside”).hidden && !$w(“#DefibInside”).hidden && !$w(“#GlovesInside”).hidden && !$w(“#MaskInside”).hidden){
$w(“#CPRbackpack”).changeSlide(2);
}
}

good luck,

1 Like

Thanks for your response Erez. I made an awesome state selector you can see if you click anywhere it says “find a class” on the site. But I need to study up more on Java as I haven’t really used it for a long time now (second year of school a decade ago). The code you supplied makes perfect sense in my mind but when I add it to my page code, it seems to do nothing. I’m sure that I’m missing something simple and easy here but I just can’t put my mind around it. I need to call it or something or trigger it someway and it’s just not registering in my brain.