esta ejemplo funciona bien, pero cuando coloco el maus encima y lo quita rapido como diez veces, no sabe que hacer, si la funcion onMouseOver o onMouseOut
aquí les dejo el ejemplo funcionando
les va encantar, solo hay que mejorarlo ojala alguien me pueda ayudar
http://cursosdematematicas.com/boton123.php
Código PHP:
Ver original
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <title>contador</title> <script type="text/javascript"> var cont2 = 0; function cambio_color(){ var unos = document.getElementById("uno"); //esto es para que vean los valores del contador pero lo pueden borrar unos.innerHTML = cont2; //esto es para que vean los valores del contador pero lo pueden borrar cont2+=10; if(cont2 <= 160){ var cambiar = document.getElementById("div1").style.backgroundPosition="0"+"-"+cont2+"px"; }else{ clearInterval(a); //con esto detengo el movimiento y lo dejo en 160 cont2=160; } } function regresar_color(){ var unos = document.getElementById("uno"); //esto es para que vean los valores del contador pero lo pueden borrar unos.innerHTML = cont2; //esto es para que vean los valores del contador pero lo pueden borrar cont2-=10; if(cont2 >= 0){ var cambiar = document.getElementById("div1").style.backgroundPosition="0"+ "-" +cont2+"px"; }else{ clearInterval(b); //con esto detengo el movimiento y lo dejo en 0 cont2=0; } } </script> </head> <body > <div id="div1" class="a" style="width:300px; background-image:url(boton_g.gif); height:150px; background-repeat: no-repeat;" onMouseOver="a=setInterval('cambio_color()',100)" onMouseOut="b=setInterval('regresar_color()',100)" > </div> <div id="uno"></div> </body> </html>