logo标签列表

使用JavaScript在刷新页面时更改HTML背景。

javascripthtmlcssbackground-image
3

我希望在每次刷新时更改我的HTML背景图片。

这是我在CSS中得到的内容。

html { 
    background-repeat:no-repeat;
    background-position:center center;
    background-attachment:fixed; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

这是我用JavaScript（在单独的JS文件中）得到的结果：

var totalCount = 6;
function ChangeBackground()
{
var num = Math.ceil( Math.random() * totalCount );
document.body.parentNode.background = 'background/test/'+num+'.jpg';

}

我在HTML末尾调用我的函数：
<script type="text/javascript">
ChangeBackground();
</script>

我无法使用我拥有的javascript代码在html标签上添加背景。是否有其他方法？
我想特别在html标签上设置它，因为我认为那样更好：
我们可以通过CSS纯粹地实现这一点，这要归功于CSS3中的background-size属性。我们将使用html元素（比body更好，因为它始终至少与浏览器窗口的高度相同）。我们在其上设置一个固定和居中的背景，然后使用background-size设置为cover关键字来调整其大小。

http://css-tricks.com/perfect-full-page-background-image/

但它没有起作用...没有帮助。什么没有起作用？ - Praveen Kumar Purushothaman
我无法使用我拥有的JavaScript代码在HTML标签上添加背景。还有其他方法吗？ - user1386906
var html = document.documentElement; 变量html等于文档的根元素。 - João Paulo Macedo
2
更新的示例，展示了背景切换 - http://jsfiddle.net/8wGYF/2/（点击“运行”进行刷新）; - João Paulo Macedo
2个回答
2
尝试将background-image样式属性值设置为url，而不是直接指定链接。

即：使用document.body.parentNode.style.backgroundImage = 'url(background/test/'+num+'.jpg)';代替document.body.parentNode.background = 'background/test/'+num+'.jpg';

JSFiddle：http://jsfiddle.net/HHeKK/

0

你不能给 <html> 标签添加背景！

请按照以下方式更改你的代码：

document.body.style.backgroundImage = 'background/test/'+num+'.jpg';
有没有办法用JavaScript为HTML标签添加背景？因为这里说它比在body标签上更好：http://css-tricks.com/perfect-full-page-background-image/ - user1386906
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接