Возможно изменить значение в css классе через js?

Question

[Виталий Рыбченко]

Есть css класс
.panTop_panelHeader_HC {max-width:1024px}
Данный класс устанавливает контейнеру div максимальное значение.
Я знаю, что можно напрямую обратиться к div и установить ему данное значение скриптом, но этот вариант не подходит - данный div динамический и формируется ПОСЛЕ всех сценариев на странице, а также содержит динамический контент, который появляется при клике - в этот момент у него меняется часть style.

Возможно ли изменить значение непосредственно у класса css? Я бы хотел в зависимости от ширины экрана устанавливать нужную ширину контейнера.

P.S. Ширина в % не работает - контейнер содержит текст, который обрезается, если не вмещается - из-за данного текста при относительной ширине контейнер уходит за границы экрана.

Answer 1

[Дмитрий Гусев]

как вариант можете в head добавить style
и в этот style потом перезаписывать стили, еще можно к ним important добавлять, чтоб перебить тот, который в css файле обьявлен

Comments

[Виталий Рыбченко]

А как перезаписывать style, можете пример обращения к нему дать? у меня как раз этот класс в head лежит.

[Дмитрий Гусев]

biovr: $('style#styleId').text('.panTop_panelHeader_HC {max-width:1024px !important;}');

[Виталий Рыбченко]

Дмитрий Гусев: Спасибо, это именно то, что я хотел!

[Виталий Рыбченко]

style id="styleId" /style

Answer 2

[Максим Тимофеев]

Можно менять классы $('#mydiv').addClass('nkffk').removeClass('dscsdvds');
Можно создавать событие при смене содержимого div и вычислять нужную ширину, каждый раз.
Можно правильно сверстать, чтобы не приходилось лепить такие костыли.

Answer 3

[Евгений Бакулин]

document.getElementsByClassName('Ваш класс') - коллекция элементов с этим классом
в цикле перебираем элементы, ставим нужный стиль

var s=document.getElementsByClassName('panTop_panelHeader_HC');
for (i=0;i<s.length;i++) {
 s[i].style.maxWidth="800px";
};

как-то так...

Answer 4

[Андрей]

Человек спросил одно, а отвечают ему совсем другое... :)

Сегодня я тоже озадачился подобным вопросом, мне нужно менять поведение класса в зависимости от контента, и его (класс) задает плагин jQuery. Я скорее всего пойду другим путем, и просто добавлю в плагин возможность задавать CSS не только объектом, но и функцией, и уже из функции буду разруливать.

А в твоем случае решение можно попробовать поискать на данном сайте www.shawnolson.net/a/503/altering_css_class_attrib...

Comments

[Андрей]

А, по факту, сделал совсем иначе. Вычислил все группы объектов (один CSS для группы), и инициировал плагин отдельно под каждую группу с соответствующим CSS.

[Виталий Рыбченко]

Андрей: такой пример jsfiddle
суть в том, что контейнер, в который добавляется некий html контент расположен отдельно от контейнера, из которого вызывается код, работающий со вставленными данными.