Динамический CSS средствами JS

[Aspiring]

Вопрос: как?

Нашел статью, но у меня выходит ошибка:

Uncaught exception: ReferenceError: Undefined variable: CSS

http://revnode.com/oss/css/

[monolithed]

Для каких целей?

[vflash]

tx - css текст
d - document;
вернет ноду созданного стиля. в IE6 лучше создавать стили до body иначе тормоза сильные.

function include(tx, d) {
var s;
if (d.createStyleSheet) try {
(s = d.createStyleSheet()).cssText += tx;
return s.owningElement;
} catch(e){};


(s = d.createElement('style')).type = 'text/css';
s.appendChild(d.createTextNode(tx));
if (d = d.documentElement.firstChild) d.appendChild(s);
return s;
};

[Aspiring]

vflash, я так понял это код динамического добавления css-файла.

Я бы хотел динамический изменять один параметр. А именно: есть коробка, высотой на всю страницу. А ширину (widthtable) задает пользователь.

table.style = 'width: "widthtable"';

Возможно ли сделать такое?

[B~Vladi]

table.style.width = widthtable + 'px';

[inGray]

Aspiring,
А почему через css-файл? Все что есть в нем можно задать через DOM.

[vflash]

Aspiring,
да можно. styleNode.sheet.cssRules (в IE свое наименование).

но не советую, IE тормозит и другие браузеры думаю на тяжелых страницах будут не очень себя чувствовать. также нужно учитывать что стили загруженные с другого домена недоступны для изменения.

inGray, там где нужно изменить параметр огромной группе может оказаться быстрее чем пробегать по каждому элементу.

[Aspiring]

B~Vladi, :) спасибо

vflash, спасибо за разъяснения. У меня всего один table

Спасибо Вам форумчане. Уже какой раз обращаюсь к Вам с нелепыми вопросами.

PS: Я счастлив, таблица "нарисовалась" на браузере так, как я задумывал. Думаю, редко кто применял такой способ :)


a[n].style = 'width: 50; height: 50; margin: 5; white-space: pre-line';

widthtable = cols * 55+ 40;
table.style.width = widthtable + 'px';


В результате не вмещенные элементы таблицы идут следующей строкой. Так добивается нужное количество ячеек в каждой строке.

Вначале пробывал вставлять .innerHTML += "<br />" после каждой строки, но после этого неработало свойтво .onclick для всех ячеек, кроме последней строки.

[B~Vladi]

a[n].style = 'width: 50; height: 50; margin: 5; white-space: pre-line';
Странно, что это работает... Вообще надо так:
a[n].style.cssText = 'width: 50; height: 50; margin: 5; white-space: pre-line';

[Aspiring]

Странно, что это работает... Вообще надо так:
a[n].style.cssText = 'width: 50; height: 50; margin: 5; white-space: pre-line';

Вот оказывается из-за чего код работал только на Opera. Более того без ошибок при инспектировании страницы.

Все время оставлял на потом. Спасибо, что сэкономили мне время :victory: