jQueryを使用して幅をパーセンテージで設定する

jQueryを使用してdivの幅をパーセンテージで設定するにはどうすればよいですか？

jquery width

— プラサド
ソース

133

幅関数の使用：

$('div#somediv').width('70%');

変わるだろう：

<div id="somediv" />

に：

<div id="somediv" style="width: 70%;"/>

— ダリン・ディミトロフ
ソース

変数で幅を取得しました！どうすれば％widthにすることができますか？

— hemnath mouli 2015

@hemnathmouli jQuery（ "div＃somediv"）。width（myvar + "％"）;

— Zorgatone 2016

幅が24％の要素がありますが、提案どおりに幅を11％に設定すると、代わりに33％の幅になります。既存の幅に幅を追加していると思いましたが、ご覧のとおり、33ではなく24 + 11 = 35です。これが発生する理由について何か考えがありますか？

— ユージーン

これが古い投稿であることは知っていますが、グーグルでの最初の結果なので、私はちょうどそれに遭遇しました。css（）関数がwidth（）よりも少し速いことに気づきましたが、おそらく私は間違っています。

— ドハブ2018

を使用して幅を設定しようとしました.width("20%")が、要素がに設定され続けましたwidth: 24%。ドキュメントを調べたところ、これはCSSbox-sizingプロパティに関連していることがわかりました。を使用.css({'width':"20%"})すると、この調整を回避できます。

— khartnett

ヘムナス

変数がパーセンテージの場合：

var myWidth = 70;
$('div#somediv').width(myWidth + '%');

変数がピクセル単位であり、親が占める割合が必要な場合：

var myWidth = 140;
var myPercentage = (myWidth / $('div#somediv').parent().width()) * 100;
$('div#somediv').width(myPercentage + '%');

— ジョナサン長老
ソース

これが私のために働いた代替案です：

$('div#somediv').css({'width': '70%'});

— joaorodr84
ソース