Eh estado buscando como saber el tiempo en milisegundos o segundos que pasa el cursor sobre un div, esto quiere decir que si pongo mi cursor sobre un div quisiera obtener el tiempo que se queda mi cursor ahí para después procesar esa información. Actualmente no tengo ningún código que me pueda servir para eso
1 respuesta
A continuación te dejo un ejemplo utilizando jQuery, primero se detecta el evento en que el cursor entra en el div
y se guarda la fecha y hora en que sucedió, y otro evento para cuando el cursor salga del div
, se vuelve a guardar la fecha y hora, y con ambas se calcula la cantidad de segundo que duro el cursor dentro del div
y se muestra el resultado.
var dateStart;
var dateEnd;
$('.zone').on('mouseenter', function() {
dateStart = new Date();
dateEnd = null;
$('.info').html('');
});
$('.zone').on('mouseleave', function() {
dateEnd = new Date();
var duration = (dateEnd - dateStart) / 1000;
$('.info').html(duration + ' segundos');
});
.zone {
background-color: red;
border: 1px solid black;
height: 100px;
margin: 1rem auto;
width: 100px;
}
.info {
border: 1px solid grey;
min-height: 25px;
margin: 1rem auto;
text-align: center;
width: 100px;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="zone"></div>
<div class="info"></div>