1

我正在尝试编写一个 java 脚本来抵消 CSS 动画的开始和循环延迟。偏移量应基于包含 div 中的图像数量。我对javascript不是很有经验,所以任何帮助都将不胜感激。

JavaScript:

function bannersImgOffset(){

var photoBanners = document.getElementsByClassName("photoBanner");
for(var i=0; i < photoBanners.length; i++){

    var bannerChildren = i.getChildNodes;
    var loopDelay = bannerChildren.length*5;

    for(i=0, i>bannerChildren.length, i++){
        var imageDelay = (i*5); 

        i.style.webkitanimation = "bannerCycle 5s linear infinite " + loopDelay + "s";
        i.style.mozanimation = "bannerCycle 5s linear infinite " + loopDelay + "s";
        i.style.msanimation = "bannerCycle 5s linear infinite " + loopDelay + "s";
        i.style.oanimation = "bannerCycle 5s linear infinite " + loopDelay + "s";
        i.style.animation = "bannerCycle 5s linear infinite " + loopDelay + "s";

        i.style.webkitanimationDelay = imageDelay + "s";
        i.style.mozanimationDelay = imageDelay + "s";
        i.style.msanimationDelay = imageDelay + "s";
        i.style.oanimationDelay = imageDelay + "s";
        i.style.animationDelay = imageDelay + "s";
        }
    }
}

html:

    <div class="photoBanner">
        <img src="Image01.jpg" alt="">
        <img src="Image02.jpg" alt="">
        <img src="Image03.jpg" alt="">
        <img src="Image04.jpg" alt="">
        <img src="Image05.jpg" alt="">
    </div>

提前致谢。

4

1 回答 1

0

您是否打算使用相同的变量来设置您的第二级 for 循环?如果没有,请尝试在第二级 for 循环中使用不同的变量。

于 2013-10-28T21:36:16.137 回答