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-codeでhtmlタグに背景を追加することはできません。他に方法はありますか？

私はそれがより良いと思うので、特にhtmlタグにそれが欲しいです：

CSS3のbackground-sizeプロパティのおかげで、これは純粋にCSSを介して行うことができます。html要素を使用します（少なくともブラウザウィンドウの高さであるため、bodyよりも優れています）。背景を固定して中央に配置し、coverキーワードに設定されたbackground-sizeを使用してサイズを調整します。

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

4

2 に答える 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/

于 2012-11-24T16:29:29.060 に答える
0

タグに背景を追加することはできません<html>！

次のようにコードを変更します。

document.body.style.backgroundImage = 'background/test/'+num+'.jpg';
于 2012-11-24T14:14:26.193 に答える