Ich mache diese kleine HTML-App mit einem Seitenleistenmenü, das beim Klicken auftaucht. Es funktioniert einwandfrei, außer dass es erst nach dem zweiten Klick zu funktionieren beginnt. Beim ersten Klick passiert nichts.

CSS:

#menubalk{
   margin-left: -260px;
}

HTML:

<div id="menubutton">
   <img src="design/images/menu.png" id="menu" onclick="toggle()" alt=""/>
</div>

<div id="menubalk">
   <h5>Menu</h5>
</div>

Javascript:

function toggle () {
  var el = document.getElementById("menubalk");
  var kop = document.getElementById("kop");
  var pag = document.getElementById("pagina");

  if ( el.style.marginLeft=="-260px" ) {
     el.style.marginLeft="0px";
     kop.style.marginLeft="260px";
     pag.style.marginLeft="260px";
  } else {
     el.style.marginLeft="-260px";
     kop.style.marginLeft="0px";
     pag.style.marginLeft="0px";
  }
}

Ich denke, ich muss möglicherweise den Rand irgendwo im Javascript einstellen, aber ich kann es nicht herausfinden.

Jede Hilfe wird sehr geschätzt!