Question

我正在开发一个项目，我需要每隔10秒更改一次背景，以使其像＆＃34; Carousel＆＃34;一样工作。但我无法找到一个有效的解决方案，以便为什么我要求你们帮忙

这是html和css中的代码，它是我需要帮助的javascript

Html：

div class="parallax">

的CSS

.parallax { 
background-image: url("../img/1.jpg");
height: 500px; 
background-attachment: fixed;
background-position: center;
background-repeat: no-repeat;
background-size: cover; }

感谢您帮助我做任何可以帮助我的事情

Answer 1

看看这是否有帮助：https://jsfiddle.net/zaedmfLs/

var myIndex = 0;
setInterval(carousel, 2000);

function carousel() {
    var i;
    var x = document.getElementsByClassName("myslides");
    for (i = 0; i < x.length; i++) {
    	console.log("Carousel");
       x[i].style.display = "none";  
    }
    myIndex++;
    
    if (myIndex > x.length) {myIndex = 1} 
    x[myIndex-1].style.display = "block";  
}

<div class="photobanner" style="max-height:460px">
        <img class="myslides" src="http://www.gstatic.com/webp/gallery/1.jpg" style="height:100%" />
        <img class="myslides" src="http://www.gstatic.com/webp/gallery/2.jpg" style="height:100%" />
        <img class="myslides" src="http://www.gstatic.com/webp/gallery/1.jpg" style="height:100%" />
        <img class="myslides" src="http://www.gstatic.com/webp/gallery/2.jpg" style="height:100%" />
        <img class="myslides" src="http://www.gstatic.com/webp/gallery/1.jpg" style="height:100%" />
        <img class="myslides" src="http://www.gstatic.com/webp/gallery/2.jpg" style="height:100%" />
    </div>

视差旋转木马

1 个答案: