0

我的 AnimationEnd 代码无法正常工作时遇到问题。EventListener 正在触发,但 AnimationEnd 未重置。我已将范围缩小到 EventListener 中的这段代码。
EventListener 就像我用它调用一个警报框一样工作,并且有问题的代码工作并发布在我编写的另一个页面上。
我的问题之一是我不确定相关行的命令行属性。
如果有帮助,我已将整个脚本放在 EventListener 代码下方,正如我所说,问题出在下面突出显示的一小段代码中。

s5.addEventListener( 'MSAnimationEnd', function( slideshow ){

这是不正确但适用于单个动画调用的图片。我怀疑它与我们在那里所做的最后部分s5()有关。

  this.style.MSAnimationName="none";s5();
 }, false);

这是整个脚本。我已经对此进行了更新并尽我所能对其进行了调试。我可以调用警报但不能休息该功能。

 var count = 0;
function slide_show() {
 var  so=document.getElementById("s0");
  var slides = document.getElementsByClassName("s"),
i = slides.length-10;
if (count < i) 
{     
 slides[count].style.animation="slideshow cubic-bezier(0.9,0.9,0.9,0.9) 1s 1 ",
      slides[count].style.webkitAnimation="slideshow cubic-bezier(0.9,0.9,0.9,0.9)  1s 1 ",   
  slides[count].style.position="fixed",
 count++;

 setTimeout(slide_show, 1200);
so.style.visibility = "hidden",
so.style.position="absolute" ;
} 
else if(   so.style.visibility =="hidden" &&
so.style.position=="absolute")
{
 so.style.visibility = "visible",
so.style.position="static";

}
 }
  function cssAnimationEnd() 
  {
 var s = document.getElementsByClassName("s");
var  s5=document.getElementById("s5");
s5.addEventListener( 'webkitAnimationEnd', function(slideshow){alert("duck");}, false),
s5.addEventListener("animationend",function(slideshow){alert("duck");}, false);
 s5.addEventListener("MSAnimationEnd",function(slideshow){ alert("duck");},   false);
s5.addEventListener("oAnimationEnd",function(slideshow){**this.style.oAnimationName = "none";s5();**}, false);
}

动画效果很好,但只有一次。

上面有问题的行不会重置动画的浏览器默认值。如果您愿意,浏览器默认为一次运行或循环,因此在调用动画后必须将其重置。我知道这一点,因为我以前经历过。我知道事件监听器正在工作,因为它会调用一个警报框。因此,我怀疑问题与我通过类而不是元素 ID 调用动画这一事实有关,因此动画默认运行 15 次,类中的每张图片运行一次。所以,我要么需要调整有问题的代码行,要么以不同的方式重置浏览器动画默认值。我怀疑第一个想法是可行的,但我在编写脚本行方面不如在诊断问题方面好。拜托,任何人的任何想法都将不胜感激并真正需要。我正在处理不同的修复程序,但是这段代码运行良好,问题是 #!$$#! 关闭所以现在我更加决心修复它。谢谢

4

0 回答 0