01K
Мой дом здесь!
- Регистрация
- 27 Июн 2013
- Сообщения
- 709
- Реакции
- 344
- Автор темы
- #1
Всем привет!
Вот уже долгое время не могу разобраться с глюком/конфликтом JS.
Использую CMS Joomla в связке с ChonoCorms.
Последний, хоть и навороченный компонент, но имеет узкие места.
Озадачился я тем, что он ещё не заточен под Twitter Bootstrap, т.е. пропорционально его поля растягиваться не будут.
Разраб написал JS скрипт/костыль, который решает этот вопрос:
Вроде бы всё работает, но кроме тех пунктов, где есть drop-down... Отключал модули, отключал библиотеки, никак разобраться не получилось.
Короче говоря, слева есть 2 формы, этот JS удаляет их стили и добавляет дополнительный:
bootstrap.min_2_forms.css
На выше указанных страницах стили этих форм слетают, а точнее скрипт подгружает стиль, но он оказывается пустым, именно на этих пунктах... !!! Смотрю через FireBug.
В общем, нуждаюсь в советах, помощи, гуру JS
Демо шаблон тут:
Вот уже долгое время не могу разобраться с глюком/конфликтом JS.
Использую CMS Joomla в связке с ChonoCorms.
Последний, хоть и навороченный компонент, но имеет узкие места.
Озадачился я тем, что он ещё не заточен под Twitter Bootstrap, т.е. пропорционально его поля растягиваться не будут.
Разраб написал JS скрипт/костыль, который решает этот вопрос:
Код:
window.addEvent('domready', function(){
var frontforms_css, template_css, bootstrap_css;
// remove ChronoForms CSS
frontforms_css = $$('link[href$="frontforms.css"]')[0];
frontforms_css.setProperty('href', '');
// move bootstrap.css
template_css = $$('link[href$="template.css"]')[0];
bootstrap_css = new Element('link',
{
type: 'text/css',
href: 'templates/tbr03/css/bootstrap.min_2_forms.css',
rel: 'stylesheet'
});
bootstrap_css.inject(template_css, 'after');
// update checkboxes
var cbx_labels, cbx_for, cbx_input, cbx_float;
cbx_labels = $$('.cfdiv_checkboxgroup label');
cbx_labels.each(function(item) {
cbx_for = item.getProperty('for');
if ( cbx_for ) {
// this is a label for a checkbox
if ( item.getParent().getParent().hasClass('radios_over') ) {
item.addClass('checkbox');
} else {
item.addClass('checkbox inline');
}
cbx_input = $(cbx_for);
cbx_input.inject(item, 'bottom');
}
});
// update radio buttons
var rad_labels, rad_for, rad_input, rad_float;
rad_labels = $$('.cfdiv_radio label');
rad_labels.each(function(item) {
rad_for = item.getProperty('for');
if ( rad_for ) {
// this is a label for a radio
item.addClass('radio inline');
rad_input = $(rad_for);
rad_input.inject(item, 'bottom');
}
});
rad_float = $$('div[style*="float:left"]');
rad_float.each(function(item) {
item.setProperty('style', '');
});
});
Вроде бы всё работает, но кроме тех пунктов, где есть drop-down... Отключал модули, отключал библиотеки, никак разобраться не получилось.
Короче говоря, слева есть 2 формы, этот JS удаляет их стили и добавляет дополнительный:
bootstrap.min_2_forms.css
На выше указанных страницах стили этих форм слетают, а точнее скрипт подгружает стиль, но он оказывается пустым, именно на этих пунктах... !!! Смотрю через FireBug.
В общем, нуждаюсь в советах, помощи, гуру JS
Демо шаблон тут:
Для просмотра скрытого содержимого вы должны войти или зарегистрироваться.