ugrás a tartalomhoz

Js elrejtés - megjelenítés

Try · 2011. Szep. 22. (Cs), 21.06
Egy előugró bejelentkezést akarok létrehozni, de nem akar összejönni. A bejelentkezés szöveg mindig ottmarad. A másik problémám pedig az, hogy kerülne alá tartalom, és szeretném, hogy amikor lenyílik, akkor ne küldjön arrébb mindent. Ötletek?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" />
<title></title>
<script type="text/javascript">
function megjelenit(){
document.getElementById('button').style.display="block"
document.getElementById('userid').style.display="block"
document.getElementById('userpw').style.display="block";
}
function elrejt(){
document.get.ElementById('logintext').style.display="none";
</script>
</head>

<body>
<form name="elso">
<input type="text" name="userid" style="display:none" id="userid" value="Felhasználónév" onClick="document.elso.userid.value=' '"/>
<input type="text" name="userpw" style="display:none" id="userpw" value="Jelszó" onClick="document.elso.userpw.value=' '"/>
<input type="button" name="belepes" style="display:none" id="button" value="Belépés" />
<span onclick="megjelenit()" style="cursor:pointer">
<span onClick="elrejt()">
Belépés
</span>
</span>
</form>

<img src="asd.png">

</body>
</html>
‹ Kivétel kezelés kérdés! Mennyiség növelése/csökkentése az input mezőben gombokkal - Mootools ›
 ■
1

<!DOCTYPE html> <html>

Poetro · 2011. Szep. 22. (Cs), 21.31
<!DOCTYPE html>
<html>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" />
  <title></title>
  <style type="text/css">
    .js #login-content {
      display: none;
    }
    #login-content {
      position: absolute;
      z-index: 10;
      background: olive;
    }
    #login-content-hide,
    #login-content-show {
      cursor: pointer;
    }
    #login-content-show {
      display: none;
    }
    .js #login-content-show {
      display: inline;
    }
  </style>
</head>

<body>
  <form name="elso">
    <div id="login-content">
      <input type="text" name="userid" id="userid" value="Felhasználónév" onClick="document.elso.userid.value=' '"/>
      <input type="text" name="userpw" id="userpw" value="Jelszó" onClick="document.elso.userpw.value=' '"/>
      <input type="button" name="belepes" id="button" value="Belépés" />
      <span id="login-content-hide">Elrejt</span>
    </div>
    <span id="login-content-show">Belépés</span>
  </form>

  <script type="text/javascript">
    document.body.className += ' js';
    document.getElementById('login-content-show').onclick = function () {
      document.getElementById('login-content').style.display = 'block';
      this.style.display = none;
    }
    document.getElementById('login-content-hide').onclick = function () {
      document.getElementById('login-content').style.display = 'none';
      document.getElementById('login-content-show').style.display = 'inline';
    }
  </script>

  <img src="http://pophalo.hu/kepek/szereplok/15/15524/britney_spears06.jpg" alt="" />
</body>
</html>
2

Köszönöm!

Try · 2011. Szep. 22. (Cs), 21.35
Köszönöm!
3

@Poetro: Ki maradt egy

Karvaly84 · 2011. Szep. 23. (P), 06.22
@Poetro: Ki maradt egy aposztróf a 42. sorban.

@Try: Itt megint az lehet a probléma hogy a onclick-re lefut a elrejt meg a megjelenit egyszerre és ezért marad látható. Az elrejtő rutinba be kel épiteni egy olyan részt ami megállítja az esemény terjedését, hogy azt más elemek ne vegyék át.