Reputation: 1
How to make toggle button with add and remove or replace css, this my code
$(document).ready(function(){
$("#wrapper").click( function() {
if ($('.toggle').css({top: '-1000px'})) {
$('.toggle').css({top: '0px'});
} else {
$('.toggle').css({top: '-1000px'})
}
// my toggle button is animate hamburger to 'x' button
$(".icon").toggleClass("close");
});
})
Upvotes: 0
Views: 451
Reputation: 1073
Your if
statement is setting the $('.toggle')
position, not getting it. You would want something like this:
if ($('.toggle').css('top') === '-1000px') { }
But you could simplify this even further with a ternary and some jQuery chaining:
$("#wrapper").on('click', function() {
$('.toggle').css('top', $('.icon').toggleClass('close').hasClass('close') ? '-1000px' : '0px');
});
Upvotes: 2