Pergunta

Eu tenho um painel YUI draggable definido como este

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

Quando o painel é mostrado, eu quero que ele permaneça sempre visível, mesmo quando a janela é rolada. Este também é o caso, graças a fixedcenter: true. O problema é que quando a janela é rolada as posições do painel-se ao centro da janela mesmo se ele foi arrastado para outro lugar anteriormente.

Como devo modificar a definição acima de modo que a posição do painel permanece constante em relação à janela quando a janela é rolada?

Foi útil?

Solução

Envolva seu recipiente painel em um elemento de invólucro que fixou posicionamento, por exemplo.

<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>

construir o seu painel sem a propriedade de configuração fixedcenter e centralizar o painel imediatamente depois de torná-lo, por exemplo.

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

O painel agora deve ficar na mesma posição quando a janela é rolada. Eu só testei isso no Firefox 3.0 e Internet Explorer 7 e 8.

postou o fonte de um exemplo independente que irá demonstrar este trabalho.

Outras dicas

De acordo com a documentação, definir o fixedcenter a:

"contida" Para permitir o posicionamento centro fixo, como acontece com o verdadeiro opção. No entanto, ao contrário de definir a propriedade como true, quando o propriedade é definida como "contida", se a sobreposição é demasiado grande para o viewport, ele não vai ficar automaticamente centrado quando o usuário rola ou altera o tamanho da janela (até que a janela é suficientemente grande para conter o sobreposição). Isso é útil em casos onde a sobreposição tem tanto cabeçalho e controles rodapé da interface do usuário o qual o usuário pode precisar de acesso.

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

Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top