我的AnimationEnd代码无法正常运行。 EventListener正在触发但不是AnimationEnd重置。我已经将它缩小到EventListener中的这段代码
EventListener就像我用它调用一个警告框一样工作,有问题的代码可以工作并发布在我写的另一个页面上。
我的一个问题是我不确定该行的命令行属性
如果有帮助的话,我已将整个脚本放在EventListener代码下面,正如我所说,问题出现在下面突出显示的这一小段代码中。
s5.addEventListener( 'MSAnimationEnd', function( slideshow ){
这是不正确但可以在单个动画调用中使用的pice。我怀疑它与最后一部分 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);
}
动画效果很好但只有一次。
上面讨论的行不会重置动画的浏览器默认设置。如果您愿意,浏览器默认为一次运行或循环,因此在调用动画后必须重置它。我知道这是因为我以前经历过这个。我知道eventlistener正在工作,因为它会调用一个警告框。 因此我怀疑这个问题与我通过类而不是元素Id调用动画的事实有关,因为默认情况下动画运行15次,对于类中的每个图片运行一次。 因此,我要么需要调整有问题的代码行,要么以不同的方式重置浏览器动画默认值。 我怀疑第一个想法是可行的,但我不像我在诊断问题时那样擅长编写脚本行。 请,任何人的任何想法将非常感谢和真正需要。 我正在研究不同的修复程序,但是这段代码很灵活,问题有#!$$#!关闭所以现在我更加坚定地解决它。 感谢