2

ポップアップを配置する場所に関するLightbox 2のロジックは何ですか?

Firefox または Chrome を使用すると、別のページの別の場所に表示されるようです。一貫性を保つために、すべてのページで同じ高さに表示する設定はありますか?

ポジショニングを決定するために使用している CSS またはロジックは何ですか?

4

5 に答える 5

11

さまざまな場所でどのように表示されますか、どのような動作が望まれますか、サンプル ページを教えていただけますか?

スクリプト自体がポップアップの上部の位置を計算する方法は次のとおりです (ライトボックス v2.04、zip ダウンロード、js/lightbox.js、229 行目以降):

// calculate top and left offset for the lightbox 
var arrayPageScroll = document.viewport.getScrollOffsets();
var lightboxTop = arrayPageScroll[1] + (document.viewport.getHeight() / 10);
var lightboxLeft = arrayPageScroll[0];
this.lightbox.setStyle({ top: lightboxTop + 'px', left: lightboxLeft + 'px' }).show();

スクリプトはPrototype の document.viewport objectを使用するため、スクリプトは次のように現在のスクロール位置の 10% 内側にポップアップを配置します。

------- page start
|
|
|
|
|
------- scroll position top
|
------- start of lightbox popup
|
|
|
|
|
|
|
|
------ scroll position bottom
|
|
|
|
------ page end
于 2009-11-26T13:08:45.613 に答える
1

lightbox.js次のように10から100で除算を調整する231行目:

document.viewport.getHeight() / 100

サンプルコード:

    // calculate top and left offset for the lightbox 
    var arrayPageScroll = document.viewport.getScrollOffsets();
    var lightboxTop = arrayPageScroll[1] + (document.viewport.getHeight() / 100); // 
    var lightboxLeft = arrayPageScroll[0];
    this.lightbox.setStyle({ top: lightboxTop + 'px', left: lightboxLeft + 'px' }).show();
于 2012-02-18T12:36:39.457 に答える
1

これは非常に古いスレッドであることは知っていますが、それでも Google の検索結果のトップ 5 に入っています。IE/FF では良い結果が得られますが、Chrome ではそうではありません。それらをすべて一貫させるには、

js/lightbox.js の 231 行目

var lightboxTop = arrayPageScroll[1] + (document.viewport.getHeight() / 10);

に変更されました

var lightboxTop = arrayPageScroll[1] + (100);

正確には要求されたものではありませんが、ページは一貫しています。

http://www.lokeshdhakar.com/forums/discussion/5494/fixed-display-position-problems-with-firefox-but-not-ie-on-tall-webpages/p1から取得した情報

于 2012-01-08T13:16:18.257 に答える
0

Flowplayerを試すことができます:

http://flowplayer.org/tools/demos/index.html

オーバーレイの位置とサイズは、CSSファイルを介して任意の場所に設定できます。

于 2009-11-27T15:01:19.443 に答える
-2
#lightbox{
position: absolute;
top: 100px !important; /*I foxed it 100px from the top, you could fix it as much pixels as you wish*/
} 
于 2009-10-15T07:19:18.573 に答える