Afiseaza ascunde Meniu

Curs Javascript

Scriptul din aceasta pagina afisaza si ascunde un meniu cand este efectuat click pe Meniu, (de asemenea poate fi folosit si pentru alte elemente ce pot fi incluse intr-un DIV: poze, formulare, ...).
Puteti testa acest script in exemplul de mai jos.

+ Meniu

Cursuri
Jocuri
Anime

Pentru a adauga acest script intr-o pagina web:
1. Adaugati in documentul HTML, in sectiunea HEAD, urmatorul script.

<script type="text/javascript">
<!--
// https://marplo.net

function OnOff(idMenu, idsmn) {
  // Preia elementele HTML dupa argumentele functiei
  var objMenu = document.getElementById(idMenu);
  var objsmn = document.getElementById(idsmn);

  // Verifica vizibilitate meniu-lui
  // Schimba vizibilitatea si semnul din "smn"
  if (objMenu.style.display=='none') {
    objMenu.style.display='block';
    objsmn.innerHTML = " - ";
}
else {
    objMenu.style.display='none';
    objsmn.innerHTML = " + ";
  }
}
//-->
</script>

2. In document HTML, in locatia unde doriti sa aveti meniul, adaugati urmatorul cod (Inlocuiti link-urile din Meniu cu cele pentru site-ul dv.).

<h3 style="width:130px; margin:3px; text-align:center;"><span id="smn">+</span> <a href="#" id="menu" onclick="OnOff('meniu','smn');">Meniu</a></h3>
<div id="meniu" style="display:none; width:140px; text-align:center;">
  <a href="https://marplo.net">Cursuri</a><br>
  <a href="https://marplo.net/jocuri">Jocuri</a><br>
  <a href="https://marplo.net/anime">Anime</a><br>
</div>

<img src="image.jpg" usemap="#map1">
<map name="map1">
  <area shape="rect" coords="9, 120, 56, 149" href="#">
  <area shape="rect" coords="100, 200, 156, 249" href="#">
</map>

#id {
  overflow: auto;
}

document.getElementById("id").onmouseover = function(){
  document.write("Sa ai Viata Buna");
}

if(isset($_GET["id"])) {
  echo $_GET["id"];
}

Marc is the boy who won the prize.
- Marc e baiatul care a castigat premiul.

Voy a ver al pintor de quien les hablé ayer.
- Ma duc sa vad pictorul despre care ti-am vorbit ieri.