I am facing an issue with my two slider menus, where only the right menu holds the active value when clicked. The left menu slides out only when the toggle button is held down, but I need it to slide out when the toggle is simply clicked and not held down.
$('.leftToggle').on('click', function(e) {
$(".sidebarleft").toggleClass("sidebarleftactive");
});.sidebarleft {
position: absolute;
padding-top: 0px;
left: auto;
top: 7vw;
height: 80%;
right: 25%;
width: calc(50% + 20px);
background-color: #2E3192;
border-color: #2E3192;
border-style: solid;
border-width: 5px;
padding-right: 20px;
padding-left: 5px;
-webkit-transition: all 1s;
}
.sidebarleft:active {
right: 70%;
width: 25%;
overflow: hidden;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="sidebarleft" id="sideleft">
<div class="lefttext">
<div class="leftTitle">title</div>
<div class="leftToggle">+</div>
<div class="leftSubHead">subheading</div>
<div class="leftInformation">
<br />
<div>
<br>text
<br />
<form></form>
</div>
</div>
</div>
</div>