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

Question

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

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

优选地，动画会循环播放，以便用户永远无法捕捉图像？

这是an example of what I have so far，下面是我的jQuery代码：

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

万分感谢！

Answer 1

这是example。它涵盖了我猜的基础知识。

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' });
    });
});