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
  1. <!DOCTYPE html>  
  2. <html>  
  3.   <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" />  
  4.   <title></title>  
  5.   <style type="text/css">  
  6.     .js #login-content {  
  7.       display: none;  
  8.     }  
  9.     #login-content {  
  10.       position: absolute;  
  11.       z-index: 10;  
  12.       background: olive;  
  13.     }  
  14.     #login-content-hide,  
  15.     #login-content-show {  
  16.       cursor: pointer;  
  17.     }  
  18.     #login-content-show {  
  19.       display: none;  
  20.     }  
  21.     .js #login-content-show {  
  22.       display: inline;  
  23.     }  
  24.   </style>  
  25. </head>  
  26.   
  27. <body>  
  28.   <form name="elso">  
  29.     <div id="login-content">  
  30.       <input type="text" name="userid" id="userid" value="Felhasználónév" onClick="document.elso.userid.value=' '"/>  
  31.       <input type="text" name="userpw" id="userpw" value="Jelszó" onClick="document.elso.userpw.value=' '"/>  
  32.       <input type="button" name="belepes" id="button" value="Belépés" />  
  33.       <span id="login-content-hide">Elrejt</span>  
  34.     </div>  
  35.     <span id="login-content-show">Belépés</span>  
  36.   </form>  
  37.   
  38.   <script type="text/javascript">  
  39.     document.body.className += ' js';  
  40.     document.getElementById('login-content-show').onclick = function () {  
  41.       document.getElementById('login-content').style.display = 'block';  
  42.       this.style.display = none;  
  43.     }  
  44.     document.getElementById('login-content-hide').onclick = function () {  
  45.       document.getElementById('login-content').style.display = 'none';  
  46.       document.getElementById('login-content-show').style.display = 'inline';  
  47.     }  
  48.   </script>  
  49.   
  50.   <img src="http://pophalo.hu/kepek/szereplok/15/15524/britney_spears06.jpg" alt="" />  
  51. </body>  
  52. </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.