654380491
hola@carlosdk.com
Login
[miniorange_social_login]

Login with your site account

Lost your password?

Carlos DK Carlos DK
  • Inicio
  • Kit digital
  • Universo Dk
  • Blog
  • Contacto
Back
  • Inicio
  • Kit digital
  • Universo Dk
  • Blog
  • Contacto
  • Home
  • Blog
  • Tutoriales formativos
  • Cómo saber la posición del ratón JQuery, código fuente

Tutoriales formativos

22 May

Cómo saber la posición del ratón JQuery, código fuente

  • By Carlos Dk
  • In Tutoriales formativos
  • 0 comment

En mi coqueteo con JQuery he comenzado a realizar algunas operaciones con los eventos y demás, he de decir que la sencillez con la que se trabaja es absoluta, en relativamente poco tiempo he podido realizar este pequeño ejemplo para mostrar las coordenadas del ratón y cambiar el contenido de una capa para mostrar la información de la posición en x e y del mouse.

El código que viene a continuación no tiene ninguna complicación a mi entender, viene lo suficientemente comentado para saber que es lo que hace 😉

<!DOCTYPE html>

<html>
<head>
<title>Leer la posición del ratón con JQuery y mostrarlas en una capa llamada txtCoordenadas</title>
<meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″>
<script src=”//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js”></script>
<script type=”text/javascript”>

/* JQUERY que toma las coordenadas del ratón dentro del documento y las muestra en la capa Coordenadas*/
$(document).ready(function() {
$(document).mousemove(function(e){
$(‘#txtCoordenadas’).html(“Pos x : ” + e.pageX + ” | Pos y : ” + e.pageY);
});
});
</script>
</head>
<body>
<div id=”txtCoordenadas”></div>

</body>
</html>

Os dejo el ejemplo con su código fuente para saber la posición del ratón JQuery

Si os gusta compartir y comentad! 😉

 

Tags:jquery
  • Share:
Carlos Dk

You may also like

Crear categorías y configurar menú en WordPress en 4 min.

  • marzo 3, 2019
  • by Carlos Dk
  • in Tutoriales formativos
Crear categoría y menú WordPress Es indispensable en una nueva instalación de WordPress, crear las...
Instalar tema en WordPress en 2 pasos
febrero 23, 2019
Actualizar MySQL 5.1 a 5.6 en CentOS 6.9 con Plesk como panel
octubre 20, 2018
Recorrer todos los objetos de una capa o del DOM completo con JQuery
diciembre 22, 2014

Leave A Reply Cancelar la respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Busca en la web

Recomiendo

Software ERP empresarial

Categorías

  • Miscelanea (129)
  • Tutoriales formativos (622)

Ponte en contacto

+34 654380491

hola@carlosdk.com

Torre del Mar (Málaga)

Enlaces rápidos

  • Universo Dk
  • Contacto
  • Blog

Soy social

  • Twitter
  • Linkedin
  • Youtube

Newsletters

Suscríbete para enterarte de lo último que estoy haciendo. No lo usaré para enviarte SPAM inútil 😉

Esta web la he diseñado con cariño en Andalucía por Carlos Dk