CODEWITHSUNDEEP
jqueryjquery-animate
RemeJuan
RemeJuan

Reputation: 863

jQuery reverse animation on click

Looked through a few of the existing questions and they helped me get this far, but still cannot get it working.

$('#languageSelctor').click(function()
{
    $('#languageList').toggle(function()
    {
        $(this).animate({"top": "20px"},500);
    },  function() 
    {
        $(this).animate({"top": "-100px"},500);
    });
});

Managed to put together the above code, but now it just does not work. So when someone clicks on languageSelctor, languageList needs to appear and then disappear if they click on languageList again.

Upvotes: 1

Views: 2173

Answers (2)

PSR
PSR

Reputation: 40338

You can simply use this to hide and show the content.

$('#languageSelctor').click(function()
{
    $('#languageList').toggle();
});

$('#languageList').click(function()
{
    $(this).hide();
});

.toggle()

Upvotes: 0

Ram
Ram

Reputation: 144709

$('#languageSelctor').click(function() {
    var $language = $('#languageList'),
        top = $language.css('top') === '-100px' ? '20px' : '-100px';
    $language.stop().animate({top: top}, 500);  
});

Upvotes: 2

Related Questions