jQuery fancybox插件沒有集中在safari或chrome中，但在Firefox中

我剛剛在我的網站上安裝了fancybox，它在firefox中完美運行，但是當我在chrome和safari中嘗試它時，fancybox不居中在瀏覽器窗口中。jQuery fancybox插件沒有集中在safari或chrome中，但在Firefox中

任何見解？

您可以在觀看演示：

http://kotyy.com/kotyy/lindseyandasp/test2.xhtml

來源

2010-03-25 kotyy

題外話，但你的一些環節不工作 – 2010-03-26 00:30:40

討厭回答我的問題，但也許這將有助於出又一出。我爲我的內容添加了一個包裝，現在它工作正常。

來源

2010-03-26 00:21:48 kotyy

即可發表評論更多一點，你究竟是如何把你的包裝？你可以發佈代碼片段嗎？ – basZero 2015-07-17 12:23:29

我有同樣的問題，使用燈箱1.3.1和jquery 1.4.2。

在簡短的代碼後，我發現功能fancybox_get_viewport問題。它使用$（window）.width（）和$（window）.height（）來確定當前視口。問題是，在Chrome和Safari上，這個功能會返回文檔寬度和高度。在Opera上，請參閱http://updatepanel.net/2009/02/20/getting-the-page-and-viewport-dimensions-using-jquery/

解決方法很簡單。使用window.innerHeight ? window.innerHeight : $(window).height();

這裏被修改功能，替換您jquery.fancybox-1.3.1.js：

fancybox_get_viewport = function() { 
    return [ (window.innerWidth ? window.innerWidth : $(window).width()), 
     (window.innerHeight ? window.innerHeight : $(window).height()), 
     $(document).scrollLeft(), $(document).scrollTop() ]; 
}, 
......

來源

2010-08-04 16:12:26 Choze

感謝這個解決方案，但是你應該使用編碼選項來過去的代碼樣本，因爲它是不可讀的+你的鏈接已經死了。 – Mermoz 2011-04-15 11:30:20

'$（window）.height（）'返回文檔高度而不是窗口高度[如果文檔當前以怪癖模式加載]（http://viralpatel.net/blogs/jquery-window-height-incorrect/）。 – 2015-01-21 21:54:30

感謝上面的代碼片段。但是，它只能解決照片現在在屏幕上正確居中的問題。 fancybox-overlay（圖像背後的半透明框）仍然不是屏幕的100％。應該進行其他調整嗎？ – basZero 2015-07-17 12:22:03

答案上面並沒有爲我工作。我剛剛使用$.fancybox.center(true);解決了fancybox打開時的問題。有時候它會居中。或者在調整視口大小後它會居中。編輯：我想這個錯誤與問題中的錯誤略有不同，因爲它確實發生在Firefox，IE，chrome等等。

$('a.whatever').fancybox({ 
    //Your options here... 
    onComplete: function(links, index) { 
    //leave this at the bottom 
    $.fancybox.center(true); 
    } 
});

來源

2011-09-15 02:27:01 Keyo

在最新的fancybox我認爲新的方法是$ .fancybox.reposition（） – vaskort 2014-09-08 11:06:11

我也是用的fancybox 1.3.4和解決，我做了類似的什麼上面建議的東西，但是，該功能在1.3.4略有不同 - 萬一有什麼問題，爲什麼我沒有使用Fancybox 2 - 這僅僅是因爲新的許可證。希望這有助於：

_get_viewport = function() { 
    return [ 
     (window.innerWidth?window.innerWidth:$(window).width()) - (currentOpts.margin * 2), 
     (window.innerHeight?window.innerHeight:$(window).height()) - (currentOpts.margin * 2), 
     $(document).scrollLeft() + currentOpts.margin, 
     $(document).scrollTop() + currentOpts.margin 
    ]; 
},

來源

2013-06-18 17:51:29

感謝您節省我的時間。該片段起作用。 – michalzuber 2017-09-18 14:11:30

我的榮幸！很高興幫助。 – 2017-09-19 16:00:55

jQuery fancybox插件沒有集中在safari或chrome中，但在Firefox中

回答

相關問題