Brainstorrrm, thanks for the response. I agree with you – there’s surely a better way to accomplish this task. But . . .
It’s bugging me! Multiple show() works ok. Multiple hide() works ok. Why doesn’t multiple show() + hide() work correctly?
See it here: https://craig3598.wixsite.com/website//test-show-hide
Annotated code shown below – it’s a bit easier to understand.
// Simple animation using: show() + hide() with fadeOptions for timing
$w.onReady( function () {
// Bunch of fadeOptions used for timing
let fadeOption0 = {
“duration”: 0,
“delay”: 0
};
let fadeOption1 = {
“duration”: 0,
“delay”: 400
};
let fadeOption2 = {
“duration”: 0,
“delay”: 800
};
let fadeOption3 = {
“duration”: 0,
“delay”: 1200
};
let fadeOption4 = {
“duration”: 0,
“delay”: 1600
};
let fadeOption5 = {
“duration”: 0,
“delay”: 2000
};
let fadeOption6 = {
“duration”: 0,
“delay”: 2400
};
// Button 1 shows GIFs in sequence - this works fine
$w(‘#button1’).onClick((event) => {
$w(‘#image1’).show(“fade”, fadeOption1);
$w(‘#image2’).show(“fade”, fadeOption2);
$w(‘#image3’).show(“fade”, fadeOption3);
$w(‘#image4’).show(“fade”, fadeOption4);
})
// Button 2 hides GIFs in sequence - this works fine
$w(‘#button2’).onClick((event) => {
$w(‘#image1’).hide(“fade”, fadeOption1);
$w(‘#image2’).hide(“fade”, fadeOption2);
$w(‘#image3’).hide(“fade”, fadeOption3);
$w(‘#image4’).hide(“fade”, fadeOption4);
} )
// Button 3 shows and hides GIFs in sequence - THIS DOES NOT WORK
$w(‘#button3’).onClick((event) => { // show and hide each gif in sequence
$w(‘#image1’).show(“fade”, fadeOption0);
$w(‘#image1’).hide(“fade”, fadeOption1);
$w(‘#image2’).show(“fade”, fadeOption2);
$w(‘#image2’).hide(“fade”, fadeOption3);
$w(‘#image3’).show(“fade”, fadeOption4);
$w(‘#image3’).hide(“fade”, fadeOption5);
$w(‘#image4’).show(“fade”, fadeOption6);
})
});