设置使用背景更改脚本的背景

Setting the background that works with background changing script

本文关键字:背景 脚本 设置      更新时间:2023-09-26

当我将鼠标悬停在文本上时,我有一个脚本可以更改页面的背景,但当页面第一次加载时,我如何设置背景?

如果你能帮忙的话,谢谢。

html:

<div class="bg1">
<p style="background-image:url(http://i.imgur.com/tsvMD.jpg)" onMouseOver="bgChange('http://i.imgur.com/tsvMD.jpg')">001</p>
<p style="background-image:url(http://i.imgur.com/WoXUM.jpg)" onMouseOver="bgChange('http://i.imgur.com/WoXUM.jpg')">002</p>
<p style="background-image:url(http://i.imgur.com/Q5U1L.jpg)" onMouseOver="bgChange('http://i.imgur.com/Q5U1L.jpg')">003</p>
</div>

css:

.bg1 p {
display:inline;
font-size: 30px;
}

javascript:

function bgChange(bg)
{
document.body.background=bg;
}

工作示例:http://jsfiddle.net/XXwXq/

使用css?

body {
    background-image:url(http://i.imgur.com/tsvMD.jpg);
}​

http://jsfiddle.net/XXwXq/13/

function bgChange(bg) {
   document.body.style.background="url(" + bg + ")";
}

在bgchange函数下面添加此行:

window.onload=bgChange('http://i.imgur.com/Q5U1L.jpg');

因此:

function bgChange(bg)
{
    document.body.background=bg;
}
window.onload=bgChange('http://i.imgur.com/Q5U1L.jpg');

使用CSS和"背景图像":

body {
  background-image:url(...)
}