更改预定义的身体背景图像 [英] Change pre-defined body background image

问题描述

我发现这个脚本可以在您点击链接时更改正文的背景图像。它很有效，除了唯一的问题是我不能在css中有预定义的bg图像，否则它不会改变。

I found this script to change the body's background image when you click a link. It works, great except the only problem is is that I cannot have a pre-defined bg image in the css or else it won't change.

所以我删除了css为背景图像并且它可以很好地切换图像，但我想要一个默认的图像开始。

So I remove the css for the background image and it switches the images fine, but I want an image to be default to start with.

脚本：

    <script language="JavaScript">
<!--

var backImage = new Array(); // don't change this

backImage[0] = "images/bg0.png";
backImage[1] = "images/bg1.png";
backImage[2] = "images/bg2.png";
backImage[3] = "images/bg3.png";
backImage[4] = "images/bg4.png";
backImage[5] = "images/bg5.png";

function changeBGImage(whichImage){
if (document.body){
document.body.background = backImage[whichImage];
}
}

//-->
</script>

链接：

<a href="javascript:changeBGImage(1)">Change2</a>

例如，我希望bg0.png在页面加载时默认为背景。

And, for example, I want bg0.png to be the background by default when the page loads.

如果可以在bg图像之间淡入淡出，也会很棒。

It would also be great if it was possible to fade between the bg images.

提前致谢。

推荐答案

将背景保留在CSS中，然后使用此代码

Keep the background in the CSS, and use this code instead

var backImage = [
    "images/bg0.png",
    "images/bg1.png",
    "images/bg2.png",
    "images/bg3.png",
    "images/bg4.png",
    "images/bg5.png"
];

function changeBGImage(whichImage) {
    if (document.body){
        document.body.style.backgroundImage = 'url('+backImage[whichImage]+')';
    }
}

这篇关于更改预定义的身体背景图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！