@kiberchainik
начинающий найкрутейшЫй програмЁр

Как сделать выпадающее меню?

код меню
<div class="menu-event dropdown">
                            <button class="main-menu-event dropdown-toggle" data-bs-toggle="dropdown">
                                <img src="assets/images/icons/icon-open-menu.svg" alt="" />
                                <span>Menu</span>
                                <img src="assets/images/icons/icon-arrow-drop-down.svg" alt="" />
                            </button>
    <ul class="mainmenu-nav dropdown-menu cd-accordion-menu animated">
		<li class="has-children">
			<input type="checkbox" name ="group-1" id="group-1" />
			<label for="group-1">Главная</label>

      		<ul>
      			<li class="has-children">
      				<input type="checkbox" name ="sub-group-1" id="sub-group-1" />
					<label for="sub-group-1">Уроки</label>

					<ul>
						<li><a href="#0">Новые</a></li>
						<li><a href="#0">Старые</a></li>
						<li><a href="#0">Популярные</a></li>
					</ul>
      			</li>
      			<li class="has-children">
      				<input type="checkbox" name ="sub-group-2" id="sub-group-2" />
					<label for="sub-group-2">Контакты</label>

					<ul>
						<li class="has-children">
							<input type="checkbox" name ="sub-group-level-3" id="sub-group-level-3" />
							<label for="sub-group-level-3">Интересно</label>

							<ul>
								<li><a href="#0">Как сделать</a></li>
								<li><a href="#0">Подробно</a></li>
							</ul>
						</li>
						<li><a href="#0">Разработка</a></li>
					</ul>
      			</li>
      			<li><a href="#0">Веб-дизайн</a></li>
				<li><a href="#0">Вопросы</a></li>
      		</ul>
		</li>

		<li class="has-children">
			<input type="checkbox" name ="group-2" id="group-2" />
			<label for="group-2">Установка</label>

			<ul>
				<li><a href="#0">Установка CMS</a></li>
				<li><a href="#0">Установка Денвера</a></li>
			</ul>
		</li>

		<li class="has-children">
			<input type="checkbox" name ="group-3" id="group-3" />
			<label for="group-3">Приложения</label>

			<ul>
				<li><a href="#0">Скрипты</a></li>
				<li><a href="#0">Изображения</a></li>
			</ul>
		</li>

		<li class="has-children">
			<input type="checkbox" name ="group-4" id="group-4" />
			<label for="group-4">Как создать</label>

			<ul>
				<li class="has-children">
					<input type="checkbox" name ="sub-group-3" id="sub-group-3" />
					<label for="sub-group-3">Инструкции</label>

					<ul>
						<li><a href="#0">CSS</a></li>
						<li><a href="#0">jQuery</a></li>
					</ul>
				</li>
				<li><a href="#0">О нас</a></li>
				<li><a href="#0">Дополнительно</a></li>
			</ul>
		</li>
	</ul> <!-- cd-accordion-menu -->
                        </div>


// Add slideDown animation to Bootstrap dropdown when expanding.
    $('.dropdown').on('show.bs.dropdown', function() {
        $(this).find('.dropdown-menu').first().stop(true, true).slideDown();
    });

    // Add slideUp animation to Bootstrap dropdown when collapsing.
    $('.dropdown').on('hide.bs.dropdown', function() {
        $(this).find('.dropdown-menu').first().stop(true, true).slideUp();
    });

проблема в сворачивании, изначально данное выпадающее меню скрыто, при нажатии на кнопку меню, открывается блок самого меню, оно вертикальное и выпадающее, при нажатии на любую кнопку в открытом меню, открывается подменю и одновременно скрывается основной блок меню, как сделать чтоб основной блок меню не скрывался?
  • Вопрос задан
  • 107 просмотров
Пригласить эксперта
Ответы на вопрос 1
SilenceOfWinter
@SilenceOfWinter
та еще зажигалка...
это не бустрап, а то что-то когда-то им было. не изобретай велосипед, там уже все есть.
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы