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

Question

[TitNIk]

Доброго вечера. Как сделать выпадающее меню при клике на JS? Вот меню:

<div class="h_menu">
		<div class="h_menu_list" ><p>Меню</p></div>
			<div class="m_container">
				<?php wp_nav_menu (array('theme_location' => 'menu') ); ?>
			</div>
		</div>

Нужно, чтобы по умолчанию меню было скрыто и при клике на "Меню" открывалось. Делал на CSS, но, результат не очень радует (не закрывается обратно при нажатии и еще пара мелочей).

Гуглил, везде куча решений, но, как обычно, не нашел где бы объяснялся сам принцип... В JS не силен, был бы весьма благодарен за помощь.

Answer 1

[Дмитрий]

ну на jquery так будет

$(".h_menu_list p").on('click', function(){
		$('.m_container').slideToggle();
	})

Comments

[TitNIk]

Что-то не выходит ) Можно чуть подробнее? ) P.S Сайт на WP.

[Максим]

TitNIk: сам jquery подключите потом проверьте

[TitNIk]

. Shadow: В том и дело, что подключил )

[Максим]

TitNIk: подключать там надо через function.php , создавать переменную define и в ней указать url скрипта -

[TitNIk]

. Shadow:

function jquery_init() {
if (!is_admin()) {
wp_enqueue_script('jquery');
}
}
add_action('wp_enqueue_scripts', 'jquery_init');

function load_my_script() {
wp_register_script('menu', get_template_directory_uri() .
'/js/menu.js');
wp_enqueue_script('menu');
}

add_action( 'wp_enqueue_scripts', 'load_my_script' );

Все вроде подключено. В коде на сайте все скрипты в хеде.

[Максим]

TitNIk: я вижу ваш файл js а сам jquery не вижу :

[TitNIk]

. Shadow:

function jquery_init() {
if (!is_admin()) {
wp_enqueue_script('jquery');
}
}
add_action('wp_enqueue_scripts', 'jquery_init');

Не оно разве?

[Максим]

TitNIk: я имел ввиду что у вас на сервере должен лежать файл jquery.min.js и на него должна быть ссылка до подключения вашего main.js

[TitNIk]

. Shadow: Подключил, все равно не работает :(

[TitNIk]

function load_jquery_min() {
wp_register_script('jquery_min', get_template_directory_uri() .
'/libs/jquery/jquery-3.1.1.min.js');
wp_enqueue_script('jquery_min');
}

add_action( 'wp_enqueue_scripts', 'load_jquery_min' );

Проверил, все подключило. Я уверен, я что-то упускаю.. но что, хз. Со скриптами совсем беда )) Может у вас скайп есть? было бы проще ))

[TitNIk]

Черт... Забыл упомянуть. Меню адаптирую под мобильные. То бишь, блок "меню" на ПК имеет display: none.