2011-06-16 107 views
1

花了好幾天的時間試圖想出這個,但也許是不可能的。JQuery燈箱 - 限制覆蓋到特定的div - 不是整個頁面

我正在使用jquery lightbox和一個單獨的主畫面導航,每個畫廊都有一個Lighbox功能。

我想嵌套在一個div內的jquery lightbox覆蓋,所以它不覆蓋整個窗口,但只涉及它在它的div?

原因是 - 我希望無需點擊疊加層就可以訪問主導航,並且我希望燈箱內容保持在設置參數(即頁面的容器)內,不會在使用不同屏幕分辨率時四處移動因此不能與主導航欄和標題對齊。

任何建議重新:jquery腳本,插件,使用,如果可能的話,使這成爲可能。 或其他建議將不勝感激。

謝謝

+0

Mamj,如果我的回覆對您有幫助,請點擊我的帖子旁邊的複選框,以便它變成綠色。謝謝。 – 2011-06-16 22:03:37

+0

我想這是* hackable *。你可以給你正在使用的燈箱的鏈接? – 2012-10-20 20:39:20

回答

1

我想你可能要做廢除了燈箱插件的提供的覆蓋,做你自己。

創建覆蓋圖的過程很簡單。我可以在這裏重新發明輪子,或者我可以給你發這樣的博客文章:http://raventools.com/blog/create-a-modal-dialog-using-css-and-javascript/

看到覆蓋div與#overlay類?所有你需要做的,以使它的大小,以容器放在該容器覆蓋div,並設置容器樣式position: relative

您可以選擇忽略所有帖子在JavaScript端的實現並將其替換爲您喜歡的模式插件,但您需要綁定到模態對話框中的show/hide事件以顯示/隱藏您的自定義覆蓋,這應該是可能的。但是,這樣做的具體細節因您選擇的插件而異。

+0

謝謝,哼!對不起,請點擊返回並添加更多謝謝你當之無愧,但是在我點擊返回之前會說 - 我試圖關閉然後重新加載,不妨想想你的方式對我的目的更好。謝謝!謝謝 – Mamij 2011-06-16 14:30:10

+0

謝謝。 – Mamij 2011-06-16 14:30:33

+0

Mamj,如果我的回覆對你有幫助,請點擊我帖子旁邊的複選框,以便它變成綠色。謝謝。 – 2011-06-16 22:03:17

0

我正面臨一個問題,我的燈箱在頁面下加載。問題是,在CSS文件包括代碼

時 頁面下的光箱搬入我寫這行

<link type="text/css" href="css/jquery.lightbox-0.5.css" media="screen" /> 

只inculde在link標籤的rel =「樣式」

<link rel="stylesheet" type="text/css" href="css/jquery.lightbox-0.5.css" media="screen" /> 

我的問題已解決