« anterior próximo »
Páginas: [1]

Autor Tema: JavaScript evento onmousemove determinar dinámicamente coordenada ratón CU01160E  (Leído 2321 veces)

bermartinv

  • Avanzado
  • ****
  • APR2.COM
  • Mensajes: 298
    • Ver Perfil
JavaScript evento onmousemove determinar dinámicamente coordenada ratón CU01160E
« en: 19 de Noviembre 2015, 13:05 »
Dejo mi código de este ejercicio.Muy útil para hacer slide de imagenes.

Código: [Seleccionar]
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        h1 {
            display:inline;
        }
        div#pantalla{
            border:black thin solid;
            height:400px;
            width:500px;
            position:absolute;
            top:20%;
            left:20%;
           
        }
    </style>
    <script>
        window.onload=function(){
    document.getElementById("pantalla").onmousemove=situacion;
    document.getElementById("pantalla").onmouseout=situacionOut;
    }
    function situacion(evento){
        var x=evento.clientX;
        var y=evento.clientY;
       
        valorX=document.getElementById("valorX");
        valorY=document.getElementById("valorY");
        valorX.innerHTML=x;
        valorY.innerHTML=y;
        valorX.style.color="red";
        valorY.style.color="red"
       
    }
       
    function situacionOut(evento){
        document.getElementById("valorX").innerHTML='';
        document.getElementById("valorY").innerHTML='';
    }
   
    </script>
</head>
<body>
    <div id="pantalla">
        <h1 >Posicion x:<span id="valorX"></span></h1>
        <h1 >Posicion y:<span id="valorY"></span></h1>
    </div>
   
</body>
</html>Saludos.
« Última modificación: 22 de Noviembre 2015, 00:21 por Ogramar »
En línea

Ogramar

  • Moderador Global
  • Experto
  • *******
  • Mensajes: 2660
    • Ver Perfil
Re:JavaScript evento onmousemove determinar dinámicamente coordenada ratón CU01160E
« Respuesta #1 en: 22 de Noviembre 2015, 00:21 »
Buenas ejercicio bien resuelto!

Salu2
En línea
Páginas: [1]
« anterior próximo »
 

Sobre la educación, sólo puedo decir que es el tema más importante en el que nosotros, como pueblo, debemos involucrarnos.

Abraham Lincoln (1808-1865) Presidente estadounidense.

aprenderaprogramar.com: Desde 2006 comprometidos con la didáctica y divulgación de la programación

Preguntas y respuestas

¿Cómo establecer o cambiar la imagen asociada (avatar) de usuario?
  1. Inicia sesión con tu nombre de usuario y contraseña.
  2. Pulsa en perfil --> perfil del foro
  3. Elige la imagen personalizada que quieras usar. Puedes escogerla de una galería de imágenes o subirla desde tu ordenador.
  4. En la parte final de la página pulsa el botón "cambiar perfil".