Нажатие на ту же кнопку для обратного эффекта Javascript

Question

Так что я очень новичок в JavaScript и, к сожалению, я тоже не очень хорошо разбираюсь в основах.

Я работал над кодом, чтобы скрыть элемент после нажатия на него и снова отменить эффект, нажав на ту же кнопку, но я не могу этого сделать. Пожалуйста, помогите мне, вот код:

$(function() { 
    $('#boxclose').click(function(){ 
     $('#md-share-window').animate({'bottom':'-90px'},500,function(){}); 
    }); 
}); 

Answer 1

Вы можете использовать класс для определения состояния элемента, который вы аниматурируете.

Вот пример: http://jsfiddle.net/FgDaq/

$('#boxclose').click(function() { 
    var c = 'on', 
     el = '#md-share-window', 
     duration = 500; 

    if ($(el).hasClass(c)) { 
     $(el).animate({'bottom': 0}, duration) 
      .removeClass(c); 
    } else { 
     $(el).animate({'bottom': '-90px'}, duration) 
      .addClass(c); 
    } 
}); 

Answer 2

Вам нужно будет получить начальное положение (или жесткий код его) и отслеживать ли вы в начальной или обновленной позиции:

$(function() { 
    var shareWindow = $('#md-share-window'); 
    var initialPosition = shareWindow.css('bottom'); //get initial position 
    var atInitialPos = true; //whether this is the initial or updated position 

    $('#boxclose').on('click', function(){ 
     var newPosition = atInitialPos ? '-90px' : initialPosition; //determines new position 
     shareWindow.animate({'bottom': newPosition}, 500); 
     atInitialPos = !atInitialPos; //toggle initial position boolean 
    }); 
});