I want to toggle between CSS so when a user clicks the button (#user_button) it shows the menu (#user_options) and changes the CSS, and when the user clicks it again it goes back to normal. So far this is all I have:
$('#user_button').click( function() {
$('#user_options').toggle();
$("#user_button").css({
borderBottomLeftRadius: '0px',
borderBottomRightRadius: '0px'
});
return false;
});
Can anybody help?
The initiale code must have borderBottomLeftRadius: 0px
$('#user_button').toggle().css('borderBottomLeftRadius','+5px');
You can do this by maintaining the state as below:
$('#user_button').on('click',function(){
if($(this).attr('data-click-state') == 1) {
$(this).attr('data-click-state', 0);
$(this).css('background-color', 'red')
}
else {
$(this).attr('data-click-state', 1);
$(this).css('background-color', 'orange')
}
});