Я не знаю много JQuery, и я застрял, может кто-нибудь помочь.
Я коробки, которые скользят вниз при нажатии, однако я хочу их, чтобы только один мог появиться сразу. В тот момент, когда вы открываете один, другой, они оба остаются открытыми. Кто-нибудь знает, как сделать так, чтобы, когда кто-то открыт, и вы нажмете на второй, первый закроется, а второй откроется?
Благодарю.
Почему бы вам не использовать JQuery UI Accordion. Вам будет легче управлять добавлением новых разделов, а теперь ваши заголовки не будут скрыты.
Из их примера кода:
<html lang="en">
<head>
<meta charset="utf-8" />
<title>jQuery UI Accordion - Default functionality</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script>
$(function() {
$( "#accordion" ).accordion();
});
</script>
</head>
<body>
<div id="accordion">
<h3>Section 1</h3>
<div>
Section 1 Contents
</div>
<h3>Section 2</h3>
<div>
Section 2 Contents
</div>
<h3>Section 3</h3>
<div>
Section 3 Contents
</div>
<h3>Section 4</h3>
<div>
Section 4 Contents
</div>
</div>
</body>
</html>
[UPDATE] В переигровке на user2246968 комментарий: Проверьте эту скрипку это быстрый обходной путь в той же структуре кода, но все - таки я бы порекомендовал вам, чтобы дать некоторое время, проверяя JQuery UI аккордеон.
Вы также можете использовать jquery Accordion
лучшее решение для вашей проблемы, потому что, если ваше количество меню улучшится, сложность кода для slidetoggle также увеличится. Итак, пусть аккордеон справится с этим для вас
Если вы покажете нам свой код, я могу дать вам более конкретный ответ, но вы должны иметь возможность использовать что-то вроде этого:
$('.selector').click(function() {
$(this).siblings().slideToggle();
});
Таким образом, когда вы нажимаете какой-либо элемент в классе "selector", он фокусируется на элементе $ (this), который вы нажали, находит всех других текущих братьев и сестер для выпадающих меню и переключает все из них, включая тот, который вы нажали. Таким образом, он должен открыть тот, который вы нажали, и закрыть все остальные.
Пожалуйста, не указывайте внешние ссылки, вы должны отправить код в свой вопрос. Предоставление jsfiddle.net, которое воспроизводит вашу проблему, будет намного лучше.
Подойдя к вашей проблеме,
Сделайте slideToggle для обоих элементов в этих событиях щелчка.
$('#dropdown').on('click',function(){
$('.dropdownwrap').slideDown();
$('.dropdownwrap2').slideUp();
});
$('#dropdown2').on('click',function(){
$('.dropdownwrap').slideUp();
$('.dropdownwrap2').slideDown();
});
slideUp
& slideDown
вместо slideToggle
. Смотрите мой обновленный ответ.