Definir a largura como uma porcentagem usando jQuery

Como posso definir a largura de um div como porcentagem usando jQuery?

jquery width

— Prasad
fonte

133

Usando a função de largura :

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

vai virar:

<div id="somediv" />

para dentro:

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

— Darin Dimitrov
fonte

eu tenho largura em uma variável! Como posso chegar a% width ??

— Hemnath Mouli de

@hemnathmouli jQuery ("div # somediv"). width (myvar + "%");

— Zorgatone de

Eu tenho um elemento com uma largura de 24%, definir a largura como você sugere como 11% me dá uma largura de 33%. Pensei que estava adicionando a largura à largura existente, mas como você pode ver 24 + 11 = 35 e não 33. Você poderia ter alguma ideia de por que isso acontece?

— Eugene,

Eu sei que este é um post antigo, mas acabei de encontrá-lo porque é o primeiro resultado no google. Percebi que a função css () é um pouco mais rápida que o width (), talvez eu esteja errado.

— Dohab 01 de

Eu estava tentando definir uma largura usando, .width("20%")no entanto, o elemento continuava sendo definido como width: 24%. Depois de vasculhar os documentos, descobrimos que isso está relacionado à box-sizingpropriedade CSS . O uso .css({'width':"20%"})evitará esse ajuste.

— khartnett

Hemnath

Se sua variável for a porcentagem:

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

Se sua variável for em pixels e você quiser a porcentagem que ocupa do pai:

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

— Jonathan Elder
fonte

Aqui está uma alternativa que funcionou para mim:

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

— joaorodr84
fonte