Почему нажатие срабатывает только со второго раза?

Question

[Dvorak]

var doc=document;
    doc.querySelector('#see-all').addEventListener('click', function() {
      var menu=doc.querySelector('#mobile');
      if (menu.style.display=='none') {
          menu.style.display='block';
      } else {
          menu.style.display='none';
      }
    })

Изначально css-свойства для этого элемента такие:

#mobile {
	position: absolute;
	z-index: 2;
	top: 1em;
	right: 30px;
	background-color: rgb(46, 50, 49);
	color: rgb(255, 255, 255);
	display: none;
	text-align: right;
}

Скрипт срабатывает, но со второго нажатия. Как быть?

Answer 1

[Алексей]

Решение влоб:

var doc=document;
    doc.querySelector('#see-all').addEventListener('click', function() {
      var menu=doc.querySelector('#mobile');
      if (menu.style.display!='block') {
        menu.style.display='block';
      } else {
        menu.style.display='none'; 
      }
    })

или

var doc=document;
    doc.querySelector('#see-all').addEventListener('click', function() {
      var menu=doc.querySelector('#mobile');
      var s = getComputedStyle(menu);
      if (s.display=='none') {
          menu.style.display='block';
      } else {
          menu.style.display='none';
      }
    })

Comments

[Dvorak]

спасибо, заработало