Estoy empezando a estudiar javascript, y como primer "ejercicio" he creado un pequeño código para que se muestre un mensaje al presionar un botón. Todo sale perfecto, menos el mensaje, que aparece unos segundos (y la intención es que se quede fijo después de hacer clic sobre el botón).
He aquí todo el código:
Código:
¿Alguien me puede decir dónde estoy metiendo la pata? ¿?<html> <head> <style> body {margin:0;} #formulario { position:absolute; width:400px; height:400px; top:50%; margin-top:-200px; left:50%; margin-left:-200px; } .visible {display: block;} .oculto {display: none;} .caja { position:relative; left:150px; width: 100px; height: 40px; background-color:red; border-radius:20px; } .message { position: absolute; left:55px; top:60px; background-color: #F0F0F0; width: 250px; height: 20px; background-color:#096; text-align:center; color:white; padding:20px; } </style> <script type="text/javascript"> function mostrarMessage(evento, idCapa) { document.getElementById(idCapa).className = "message visible"; } </script> </head> <body> <div id="formulario"> <div id="message" CLASS="message oculto">Hemos recibido tus datos</div> <form action=""> <input type="submit" name="" class="caja" onMouseDown="mostrarMessage(event, 'message')"> </form> </div> </body> </html>
Gracias por vuestro tiempo :)