JQuery комбинирует переключатель с закрывающей кнопкой

Question

Я хотел чего-то добиться, но на удивление не смог найти код в Интернете. Функция jquery toggle великолепна, но я также хотел объединить ее с кнопкой «закрыть» внутри расширенного div. Таким образом, вы можете открыть его с помощью кнопки снаружи, а также закрыть кнопку «закрыть», чтобы закрыть ее. Ниже показано, что я безуспешно:

Вот тумблер код, я начиная с: http://jsfiddle.net/uhEgG/

$(document).ready(function(){ 

$("#country_slide").hide(); 
$("#country").show(); 

$('#country').click(function(){ 
$("#country_slide").slideToggle(); 
}); 
}); 

Я предполагаю, что нужна кнопка внутри, что делает что-то вроде этого:

$('#close').click(function() { 
    $('#country_slide').hide('slow', function() { 
    }); 
}); 

Answer 1

Вот рабочая версия: http://jsfiddle.net/uhEgG/2/ - Javascript является:

$(document).ready(function(){ 
    $('#country').click(function() { 
     $("#country_slide").slideToggle(); 
    }); 

    $('#close').click(function (e) { 
     e.preventDefault(); 
     $('#country_slide').slideToggle(); 
    }); 
}); 

и я обновил HTML:

<div id="country_slide">test<a href="#" id="close">Close</a></div> 

Answer 2

Создать одну кнопку в "#county_slide"

$('#btnClose').click(function (e) { 
    e.preventDefault(); 
    $('#country_slide').slideToggle(); 
}); 

Answer 3

Вы можете просто использовать slideUp для близко и slideDown для открытого
проверки fiddle

$('#country').click(function() { 
    $("#country_slide").slideDown(); 
}); 

$('#close').click(function() { 
    $('#country_slide').slideUp(); 
});