jquery - 添加和删​​除 css 的切换按钮

Question

如何使用添加和删除或替换 css 制作切换按钮，这是我的代码

$(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");
  });

})

Answer 1

您的 if 语句正在设置 $('.toggle') 位置，而不是获取它。你会想要这样的东西:

if ($('.toggle').css('top') === '-1000px') { }

但是您可以使用 ternary 进一步简化它和一些 jQuery chaining :

$("#wrapper").on('click', function() {
  $('.toggle').css('top', $('.icon').toggleClass('close').hasClass('close') ? '-1000px' : '0px');
});