onmouseover as using

나는 인터럽트가 가능하고 현재 표시된 그림과 일치하는 새로운 그림을 표시 할 수있는 이미지가 반복되는 연속 루프가 있습니다.이 그림은 마우스가 이미지 위에있는 한 onmouseover 영향을 사용합니다. .onmouseover as using

내 문제를 더 잘 설명하기 위해 예를 들어 5 초마다 한 번씩 이미지를 번갈아 가며 보내고 싶습니다. 그런 다음 mouseover 이벤트가 발생하면 이미지를 번갈아 표시하고 방금 표시된 이미지 (방금 표시된 이미지를 설명하는 다른 이미지)에 해당하는 새 이미지를 표시하십시오. 또한 마우스가 이미지 위에있는 동안 이미지가 번갈아 멈추기를 원합니다.

지금까지 첫 이미지에 해당 이미지를 표시 할 수 있지만 나머지는 제대로 작동하지 않습니다. 또한 마우스가 이미지 위에있는 동안 정지 이미지가 번갈아 나올 수 없습니다.

는 여기에 지금까지이 작업은 다음과 같습니다

<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>

출처

2012-09-24 Kyle Killebrew