Páginas

lunes, 22 de agosto de 2016

Luz

Hola a todos, he creado un programa sencillo pero con un  truco que creo os vendrá bien.
Se trata de un botón de encendido y apagado de una bombilla resuelto con HTML y JS. El truco consiste en dos imágenes gif del mismo tamaño una con una bombilla encendida y la otra apagada.

 <!DOCTYPE html>
 <html>
 <body>
 <script>
 function light(sw) {
   var pic;
   if (sw == 0) {
     pic = "pic_bulboff.gif"
   } else {
     pic = "pic_bulbon.gif"
   }
   document.getElementById('myImage').src = pic;
 }
 </script>
 
 <img id="myImage" src="pic_bulboff.gif" width="100" height="180">
 
 <p>
 <button type="button" onclick="light(1)">Light On</button>
 <button type="button" onclick="light(0)">Light Off</button>
 </p>
 
 </body>
 </html>

El programa:http://magnitopic.github.io/edujs/luz/