<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script type="text/javascript" src="//code.jquery.com/jquery-2.2.0.min.js"></script>
<style>
#elemento {position:absolute;width:100px;height:100px;background-color:#ccc;}
</style>
<script>
// Función que devuelve un numero aleatorio entre el min y el max indicado
function getRandomInt(min, max) { return Math.floor(Math.random() * (max - min)) + min;
}
$(document).ready(function(){ $("#elemento").hover(function(){
// obtenemos el valor vertical aleatorio
// entre 1 y la altura de la pantalla menos los 100 px del elemento
var v=getRandomInt(1,$(window).height()-100);
// obtenemos el valor horizontal aleatorio
// entre 1 y la anchura de la pantalla menos los 100 px del elemento
var h=getRandomInt(1,$(window).width()-100);
// movemos el elemento a la nueva posición
$(this).css({top: v+"px", left: h+"px"}); });
});
</script>
</head>
<body>
<div id="elemento"></div>
</body>
</html>
Crear cuenta
Comentarios sobre la versión: Versión 1.0 (0)
No hay comentarios