1

画像の背景の幅と高さを設定したい。

document.getElementById('outerModalPopupDiv').style.backgroundImage = "url('samandar_003.jpeg')";
document.getElementById('outerModalPopupDiv').style.backgroundRepeat = "no-repeat";

次に、画像の幅と高さを設定します。高さと幅の設定は知ってbackground-size: 200px 50px;いますが、同じものは使用できません。上記の形式で幅と高さを設定する必要があります。

私が使用する場合

document.getElementById('outerModalPopupDiv').style.background.size = "200px 500px";

うまくいきません。画像はそのままです。

どうすればこれを機能させることができますか。

4

3 に答える 3

7

hereに見られるように、CSS3 の js 構文background-sizeは次のとおりです。

object.style.backgroundSize="60px 80px"

したがって、コピーペーストの快適さのために、これを試してください：

document.getElementById('outerModalPopupDiv').style.backgroundSize = "200px 500px";
于 2012-07-26T10:53:40.027 に答える
1

css3 を使用すると、背景サイズを設定できます。

#outerModalPopupDiv {
    background-size: 200px 500px;
}

ここでわかるように

または、javascript で設定したい場合は、css クラスを作成し、そのクラスを要素に追加できます。

JavaScript:

document.getElementById("outerModalPopupDiv").className += "resizeBg200x500";

CSS:

.resizeBg200x500 {
    background-size: 200px 500px;
}

またはJavaScriptで直接：

document.getElementById("outerModalPopupDiv").style.backgroundSize="200px 500px";

またはjQueryを使用した別の代替手段:)

$("#outerModalPopupDiv").css("background-size","200px 500px");

background-size は css3 ですが、ここでわかるように多くのブラウザで広くサポートされています

于 2012-07-26T10:50:43.257 に答える
0

個人的には、サイズ変更と JS を使用して動的に追加するクラスを作成します。

http://jsfiddle.net/spacebeers/FFeEh/15/

document.getElementById('outerModalPopupDiv').style.backgroundRepeat = "no-repeat";

var element = document.getElementById('outerModalPopupDiv');

element.className += element.className ? ' backgroundResize' : 'backgroundResize';​
于 2012-07-26T10:37:28.813 に答える