javascript - JavaScript で幅と高さをパーセンテージで設定する

Question

ここに私のJavaScriptコードがあります:

a.width = a.width ? a.width : 640;
a.height = a.height ? a.height : 360;

代わりに 640px と 360px のパーセンテージを作成するにはどうすればよいですか? 両方をウィンドウサイズの70％にしたい。

score 1 · Accepted Answer

パーセンテージはrelative値です。

1240pxその値のパーセンテージを取得するには、screenWidth (仮定) のような相対値が必要です。

例

var pixels = 100;
var screenWidth = window.screen.width;
var percentage = ( screenWidth - pixels ) / screenWidth ; // 0.92%

score 1 · Accepted Answer

containerのサイズがすでに指定されている場合はelement、CSS で単純にパーセンテージを使用できます。例えば：

.#my-el {
    width: 70%;
    height: 70%;
}

<div id="my-el"></div>

ただし、何らかの理由で JavaScript を使用する必要がある場合は、次のようにすることができます。

el.style.width = Math.round(document.documentElement.clientWidth * .70) + 'px';

ただし、クロスブラウザーサポートのビューポートサイズを決定するには、より複雑なアプローチを使用する必要があるかもしれませんが、この質問は既に回答されています。

2 に答える 2