#javascript #extjs #positioning #portlet #portal-system
#javascript #extjs #позиционирование #портлет #portal-system
Вопрос:
Я хотел бы, чтобы портал и его портлеты ExtJS помещались в макет фиксированной ширины. Прямо сейчас они, похоже, занимают 100% ширины, и элементы, похоже, имеют встроенные стили, применяемые для придания максимальной ширины, и трюки вроде указания стиля «width: 50%» для элементов портала, похоже, ничего не делают.
Как можно изменить размер и расположение портлетов и есть ли какой-либо способ применить обычные навыки позиционирования CSS? Сгенерированный HTML в том виде, в каком он отображается в элементе Inspect, имеет встроенный стиль, определяющий ширину в пикселях, который превзойдет все, что я помещаю в таблицу стилей.
Я хотел бы, чтобы портал отображался как обычный блочный элемент с относительным расположением внутри страницы. Возможно ли это, и если нет, то каковы мои следующие наилучшие варианты?
Ответ №1:
Портлеты управляются макетом, который задает размеры, реагирует на изменение размера окна просмотра и т.д. Для этого вам придется изменить существующий макет или создать свой собственный пользовательский макет (или же создать свой собственный портал, который не основан на существующем примере).
Комментарии:
1. Есть ли страница с примерами того, как настроить макет?
Ответ №2:
кажется, у меня есть ответ. Перепишите определение области просмотра для настройки отображения в теге div. Вот мой код:
Ext.override(Ext.container.Viewport, {
initComponent : function() {
var me = this,
html = Ext.fly(document.body.parentNode),
el;
me.callParent(arguments);
html.addCls(Ext.baseCSSPrefix 'viewport');
me.el = el = 'dashboard';
el.setHeight = Ext.emptyFn;
el.setWidth = Ext.emptyFn;
el.setSize = Ext.emptyFn;
me.allowDomMove = false;
Ext.EventManager.onWindowResize(me.fireResize, me);
me.renderTo = me.el;
me.height = Ext.Element.getViewportHeight() - 70;
}});
где me.el — идентификатор отображения элемента.