Very briefly, I'm trying to create a way to slide out a div
and make it visible by clicking
a button on the webpage
. I have the css and the layout looking correct and the animation
runs once but then doesn't work again.
this is the full js file
var button1Toggle;
var button2Toggle;
var button3Toggle;
button1Toggle = false;
function slideOutFunc() {
if (button1Toggle == false) {
document.getElementById('fade-in1').style.left = '0';
document.getElementById('fade-in1').style.opacity = '1';
button1Toggle = true;
} else {
document.getElementById('fade-in1').style.left = '-33vw';
document.getElementById('fade-in1').style.opacity = '0';
button1Toggle = true;
}
}
<button id="clickApply" class="applyButton" onclick="slideOutFunc()"><a>Apply</a></button>
this is the html portion
that calls the function
Any help understanding why it only works once would be appreciated.
else
block should setbutton1Toggle = false;
, right?