Frage

Ich habe einen ziehbar YUI-Panel wie folgt definiert

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

Wenn die Tafel angezeigt wird, will ich es immer sichtbar bleiben, auch wenn das Fenster gescrollt wird. Dies ist auch dann der Fall, dank fixedcenter: true. Das Problem ist, dass, wenn das Fenster, um die Platte positioniert sich in die Mitte des Fensters gescrollt wird, auch wenn es woanders vorher gezogen wurde.

Wie soll ich die obige Definition ändern, so dass die Position der Platte konstant relativ zum Fenster bleibt, wenn das Fenster gescrollt wird?

War es hilfreich?

Lösung

Wickeln Sie Ihre Platte Behälter in einem Hüllenelement, das Positionierung fixiert hat, z.

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

Konstruieren Sie Ihr Panel ohne fixedcenter Konfigurationseigenschaft, und in der Mitte der Platte unmittelbar nachdem Sie es machen, z.

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

Das Panel sollte nun in der gleichen Position bleiben, wenn das Fenster gescrollt wird. Getestet habe ich nur diese in Firefox 3.0 und Internet Explorer 7 und 8.

Ich habe die Quelle eines umluftunabhängigem geschrieben Beispiel, das diese Arbeits demonstrieren.

Andere Tipps

Gemäß der Dokumentation, stellen Sie die fixedcenter an:

  

"enthalten" feste Mittelpunkt Positionierung zu ermöglichen, wie mit dem wahren   Möglichkeit. Doch anders als die Eigenschaft auf true setzen, wenn die   Eigenschaft auf „enthalten“, wenn die Auflage für die zu groß ist   Ansichtsfenster, wird es nicht automatisch erhalten zentriert, wenn der Benutzer einen Bildlauf   oder ändert die Größe des Fensters (bis das Fenster groß genug ist, die enthalten   Overlay). Dies ist nützlich in Fällen, in denen das Overlay beide Header hat   und Fußzeilen UI-Steuerelemente, die der Benutzer zugreifen müssen.

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

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top