YUI Панель и прокрутка - PullRequest
Новая
       19

YUI Панель и прокрутка

2 голосов
/ 09 марта 2009

У меня есть перетаскиваемая панель YUI, определенная следующим образом 

new YAHOO.widget.Panel("parameters", {
                        fixedcenter: true,
                        constraintoviewport: true,
                        underlay: "shadow",
                        visible: false,
                        close: true,
                        draggable: true,
                        width: "350px" });

Когда панель отображается, я хочу, чтобы она оставалась всегда видимой, даже когда окно прокручивается. Это также верно, благодаря fixedcenter: true. Проблема заключается в том, что при прокрутке окна панель позиционирует себя к центру окна, даже если она была перетащена в другое место ранее.

Как мне изменить приведенное выше определение, чтобы положение панели оставалось постоянным относительно окна при прокрутке окна?

Ответы [ 2 ]

4 голосов
/ 25 марта 2009

Оберните контейнер панели в элемент обертки, который имеет фиксированное положение, например, 

<div id="wrapper" style="position: fixed">
    <div id="parameters">
        <div class="hd">Header</div>
        <div class="bd">Hello, this is my awesome panel.</div>
        <div class="ft">Footer</div>
    </div>
</div>

Создайте панель без свойства конфигурации fixedcenter и отцентрируйте панель сразу после ее рендеринга, например, 

var panel = new YAHOO.widget.Panel("parameters", {
        constraintoviewport: true,
        underlay: "shadow",
        visible: false,
        close: true,
        draggable: true,
        width: "350px"
    });
panel.render();
panel.center();

Панель теперь должна оставаться в том же положении, когда окно прокручивается. Я проверял это только в Firefox 3.0 и Internet Explorer 7 и 8.

Я опубликовал источник отдельного примера, который продемонстрирует эту работу.

0 голосов
/ 19 февраля 2013

В соответствии с документацией установите фиксированный центр на:

«содержащийся» Для включения фиксированного центрального положения, как в случае с истинным вариант. Однако, в отличие от установки свойства в true, когда для свойства установлено значение «contains», если наложение слишком велико для viewport, он не будет автоматически центрирован, когда пользователь прокручивает или изменяет размер окна (пока окно не станет достаточно большим, чтобы содержать наложение). Это полезно в тех случаях, когда наложение имеет оба заголовка и пользовательский интерфейс нижнего колонтитула контролирует доступ пользователя.

http://developer.yahoo.com/yui/docs/YAHOO.widget.Overlay.html

...