Панель YUI - нужно построить страницу 3 х 3 с 9 панелями - как расположить панели вертикально - PullRequest
0 голосов
/ 25 февраля 2011

Мне нужно создать страницу 3 х 3 с 9 панелями YUI.

Я мог бы построить 3 33% вертикальных столбца с сетками YUI. 3 панели появляются в трех столбцах. Но когда я помещаю 3 панели в каждую колонку (чтобы они появлялись одна под другой), она накладывается друг на друга. Я думаю, что я должен дать координаты x, y, чтобы выровнять его, но высота панели может варьироваться, поэтому мне может понадобиться динамически определить координаты x, y.

код выглядит примерно так (использование в Django - дочерняя страница, которая расширяет основную часть, помещает содержимое панели): -

<div id="doc3">
<div id="bd" role="main">
<div class="yui-gb">
<div class="yui-u first">
{% block panel1 %}{% endblock %}
{% block panel2 %}{% endblock %}
{% block panel3 %}{% endblock %}
</div>
<div class="yui-u">
{% block panel4 %}{% endblock %}
{% block panel5 %}{% endblock %}
{% block panel6 %}{% endblock %}
</div>
<div class="yui-u">
{% block panel7 %}{% endblock %}
{% block panel8 %}{% endblock %}
{% block panel9 %}{% endblock %}
</div>
</div>
</div>
</div>

Я рендеринг, используя: -

YAHOO.example.container.panel1 = new YAHOO.widget.Panel("panel1", { width:"390px", visible:true, constraintoviewport:true } );
YAHOO.example.container.panel1.render();

Я попытался с помощью контекста сделать что-то вроде выравнивания одной панели снизу другой, например, присвоить context:["panel1","bl","tl] панели, которая должна располагаться ниже панели1. Но, похоже, не помогает.

Есть какие-нибудь указатели для этого - расположить панели YUI одну под другой в сетке YUI?

1 Ответ

0 голосов
/ 28 февраля 2011

На данный момент используется для позиционирования одной панели под другой. Обнаружил, что подложка (тень, матовая поверхность и т. Д.) Не движется, установите для этого значения значение «none». Нужно исследовать еще немного.

panel4y = YAHOO.util.Dom.getY('panel1') + document.getElementById("panel1").offsetHeight + 10;
YAHOO.util.Dom.setY('panel4',panel4y);
...