是否需要在每次鼠标悬停时使图像动画离开光标位置？

Question

我试图通过改变它在鼠标悬停时的位置来设置框的图像动画.

我可以让它移动一次,但我需要设置它,以便每次有人鼠标悬停在图像上时它会移动.我想让用户追逐屏幕周围的框.

优选地,动画将循环以便用户永远不会捕获图像？

这是我到目前为止的一个例子,下面是我的jQuery代码:

$(document).ready(function() {
    $('#img').mouseover(function() {
        $(this).animate({
            left: '500px'
        });
    });
});

太感谢了!

Answer 1

这是一个例子.它涵盖了我猜的基础知识.

jQuery(function($) {
    $('#img').mouseover(function() {
        var dWidth = $(document).width() - 100, // 100 = image width
            dHeight = $(document).height() - 100, // 100 = image height
            nextX = Math.floor(Math.random() * dWidth),
            nextY = Math.floor(Math.random() * dHeight);
        $(this).animate({ left: nextX + 'px', top: nextY + 'px' });
    });
});