2012-08-02 182 views
0

當點擊鏈接到我的燈箱 - 它將頁面內容移動到燈箱下方。我已經把z-index放在了CSS上,但我相信這還不夠。我不確定接下來我需要去哪個方向。我正試圖將lightbox放在頁面內容的頂部。我不希望頁面上的內容向下移動,我希望lightbox能夠覆蓋原始頁面的內容。當lightbox內容打開時,頁面內容向下移動 - jquery

我的小提琴:http://jsfiddle.net/stillb4llin/zZvLG/

我想我需要創建jQuery中的另一個功能插入,我已經把positionLightBox1(); (註釋掉)

我也認爲我在做CSS錯誤。我想相信我對CSS有一個堅定的把握,但我相信你不會!

經驗與jQuery:我一直在玩jQuery的幾個星期 (編輯代碼,使之爲我工作),我已經做了一些閱讀 ,並創建了一些小提琴。現在我已經感到舒服 足以創造這與我的一些經驗和一些 堆棧溢出答案的幫助。

您的意見,已經讚賞。

回答

2

只是要的位置是:絕對的#lightBoxContent而不是位置:相對

http://jsfiddle.net/zZvLG/9/

...這從「流」刪除收藏夾,並阻止它推動其他網頁內容進一步下跌。

+0

就像我說的...認爲我對CSS有把握。非常感謝,這工作得很好 – 2012-08-02 16:07:00

1

<div ID="lightBoxDiv"></div>爲什麼在打開後關閉它?我想你想關閉lightBoxContent div後關閉嗎?

+0

我關閉了原來的div,這樣我可以有燈箱本身進一步向下滾動頁面,然後我會努力使背景滾動進一步下降。 我正在處理的實際頁面有更多的內容,那麼在小提琴中有什麼。 這的確行得通,但我需要更多地考慮它,看看我能否在我的情況下運作。 – 2012-08-02 16:04:57

+0

這工作,但是我轉移到實際的網站,並添加滾動的背景後,它使視覺凌亂。否則,這是一個很好的答案,只是不適合我的情況 – 2012-08-02 17:25:42

1

lightBoxContent必須還的位置是:絕對才能正常

0

可能固定它:http://jsfiddle.net/zZvLG/14/

+0

請解釋你做了什麼,更改了html? – xec 2012-08-02 15:17:45

+0

我認爲他把第一個封閉的div移到底部 – 2012-08-02 16:07:53

+0

你可以試着解釋你的答案嗎? – 2012-08-02 16:08:16

1

只是在lightboxdiv聲明的端移動標籤到lightboxcontentdiv閉幕後。您可能需要稍微調整大小,但不會移動它後面的文本。

http://jsfiddle.net/MrMiracle/zZvLG/16/

+0

這工作,但是我轉移到實際的網站後,並添加滾動的背景,它使視覺凌亂。否則,這是一個很好的答案,只是不適合我的情況。 – 2012-08-02 17:26:11