Question

我尝试调整我在youtube上找到的一些代码并遇到了麻烦。我可以很好地切换图像，但我似乎无法调整代码来转换背景图像。

这是我的代码：

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Untitled</title>
<link type="text/css" rel="stylesheet" href="slideshow.css"/>
</head>
<body>
    <script src="slideshow.js"></script>
</body>            
</html>

和

html {
    min-height:100%;
}

body {
    background-image:url("Summer.jpg");
    background-repeat:no-repeat;
    background-size:cover;
}

和

//JavaScript Document

var myImage=document.body.style.backgroundImage;
var imageArray=["Summer.jpg", "Autumn.jpg", "Winter.jpg"];

var imageIndex=0;

function changeImage () {
    document.body.style.backgroundImage=myImage;
    myImage.setAttribute("url", imageArray [ imageIndex]);
    imageIndex++;
    if (imageIndex>=imageArray.length) {
        imageIndex=0;
        }
    }

var intervalHandle = setInterval(changeImage,2000);

我是一个完整的新手，所以如果我遗漏了一些明显的东西，请指出我正确的方向来阅读它。感谢。

Answer 1

而不是

myint = 123456789
mystr = str(myint)
print(','.join(mystr[::2]))

DO

document.body.style.backgroundImage=myImage;
myImage.setAttribute("url", imageArray [ imageIndex]);

Answer 2

您需要做的就是将正文样式的backgroundImage属性设置为相应的“url（...）”语法。将changeImage函数替换为此函数：

function changeImage () {
    document.body.style.backgroundImage = "url(" + imageArray[imageIndex] + ")";
    imageIndex++;
    if (imageIndex>=imageArray.length) {
        imageIndex=0;
        }
    }

您使用myImage.setAttribute执行的操作无效，因为myImage不是DOM元素，并且没有setAttribute方法。

使用javascript转换背景图像

2 个答案: