0

我有一个连续循环的交替图像，只要鼠标在图像上，我希望能够中断并使用鼠标悬停效果显示与当前显示的图片相对应的新图片。

作为一个更好地描述我的问题的示例，我希望每五秒钟在屏幕上交替显示一堆图像（我已经可以做到）。然后当鼠标悬停事件发生时，让图像停止交替并显示一个与刚刚显示的图像相对应的新图像（它将是另一个描述刚刚显示的图像的图像）。当鼠标悬停在图像上时，我还希望图像停止交替。

到目前为止，我可以让第一张图像显示其相应的图像，但我似乎无法让其余的工作。此外，当鼠标仍在图像上时，我无法让交替图像停止。

这是我到目前为止所拥有的：

<body>

    <img src="image1.jpeg" alt="Image1" width="344" height="311" id="rotator" onmouseover="this.src='imageText1.jpeg'" onmouseout="this.src='image1.jpeg'">



    <script type="text/javascript">
     (function()  {
        var rotator = document.getElementById("rotator");
        var imageDir = '';
        var delayInSeconds = 5;

        var images = ["image2.png", "image3.gif", "image4.png", "image5.jpeg","image6.gif", "image7.jpeg", "image1.jpeg"];

        var num = 0;
        if (rotator.onmouseover ==  )
        var changeImage = function()  {
            var len = images.length;
            rotator.src = imageDir + images[num++];
            if (num == len)  {
                num = 0;
            }
        };
        setInterval(changeImage, delayInSeconds * 1000);
    })();
    </script>
4

1 回答 1

0 
if (rotator.onmouseover ==  )
{

}

如果条件，我们必须检查一些东西。空状态是一个问题。请检查它。

于 2012-09-28T08:17:21.047 回答