jQuery，我该如何切换边距

Question

我正在使用 jQuery-ui；我怎样才能“切换”“边距”首先我有“-160px”，然后我放“33px”我想每次点击“.LoginButton”时交替进行

CSS

.MyBox {
            font-family:Arial;
            color:#FFF;
            width: 400px;
            height: 150px;
            margin-top:-160px;
}

jQuery

 $('.LoginButton').click(function () {
      $('.MyBox').animate({
           marginTop: '33px'
           }, {
           duration: 2000,
           specialEasing: {
           marginTop: 'easeOutBounce'
           },
           complete: function () {
           }
         });
 });

谢谢!!

Answer 1

或者你可以使用.toggle() http://api.jquery.com/toggle-event/

$('.LoginButton').toggle(
  function () {
    $('.MyBox').animate({
       marginTop: '-160px'
       }, {
       duration: 2000,
       specialEasing: {
       marginTop: 'easeOutBounce'
       },
       complete: function () {
       }
    });
  },
  function () {
    $('.MyBox').animate({
       marginTop: '33px'
       }, {
       duration: 2000,
       specialEasing: {
       marginTop: 'easeOutBounce'
       },
       complete: function () {
       }
    });
  }
);