Событие клика на ссылку

#html #css

Здравствуйте. 
При клике на ссылку появляются пункты меню, и если после этого кликнуть в любое место
экрана (кроме ссылки которая активирует меню) - меню пропадает.

Каким образом сделать чтоб меню пропадало еще и при повторном клике на эту же ссылку?



.menu {
  display: none;
  padding: 3px;
}
.menu a {
  display: block;
  margin: 1px;
  padding: 10px;
}
.active_menu {
  display: block;
}
.active_menu:focus ~ .menu,
.active_menu:active ~ .menu,
.menu:hover {
  display: block;
}
Развернуть
меню


  Главная  Весь каталог  Досавка
 Оплата  Условия




    

Ответы

Ответ 1

.menu {
  display: none;
}

.menu a {
  display: block;
  margin: 1px;
  padding: 10px;
}

.active_menu input:checked + .menu {
  display: block;
}

  
  Развернуть меню
  
  

    Главная
    Весь каталог
    Досавка
    Оплата
    Условия
  




Ответ 2

Его можно сделать еще с помощью плагина jQuery таким способом:



Развернуть
меню 

 
  Главная  
  Весь каталог  
  Доставка  
  Оплата  
  Условия



А если ты хочешь сделать на CSS, то сделай с помощью chekbox так:



.menu,
#menyu {
  display: none;
}
.NajmiMenya {
  padding: 10px;
  background: yellow;
  color: black;
  cursor: pointer;
  -webkit-user-select: none;
}
#menyu:checked ~ .menu {
  display: block;
}
.ubrattocki {
  list-style-type: none;
}

Развернуть Меню

  
Главная
  
  
Весь каталог
  
  
Доставка
  
  
Оплата
  
  
Условия