Fancybox彈出窗口始終在頂部滾動

Question

我已經在網站上實現了fancybox插件，但是我注意到了這個問題：

每次單擊圖像時，它都會正確打開圖像，但始終會在網站頂部滾動，並且在打開彈出窗口時不會讓我向下滾動。 你可以在我的網站上看到這個問題在這里。

我嘗試使用選項“ scrollOutside”，但是它不起作用。

非常感謝您的幫助！

Answer 1

您的CSS中有以下選擇器，這引起了問題。

html , body {
    height: 100%;
}

如果只是在這里刪除html ，它將起作用。 問題是當<html>標記的高度設為100％時，溢出無法按您需要的方式工作。

另一個選擇是為<html>標簽設置內聯樣式並設置height: auto; 。 打開控制台，然后嘗試打開圖像，該圖像不會滾動到頂部。

Answer 2

在轉到我的解決方案之前，請注意滾動本身不是fancybox問題。 您基本上可以通過瀏覽器控制台在所有其他頁面中進行測試：

$.fancybox("test");

在此網頁中，您有幾個<div>作為可滾動頁面。 也許您可以滾動回到正確的頁面。 我寫了回滾解決方案。

首先，我們需要在單擊頁面時保存它。

var thisPage = "homepage";
$(".page").click(function(){
    thisPage = $(this).attr("id");
});

現在，您可以隨時滾動回到該頁面。 例如onClosed ：

$("a.inline").fancybox({
    // ... other configurations ...
    'onClosed' : function() {
        $("html,body").scrollTop($("#"+thisPage).offset().top);
    }
});

讓我知道它是否無效。

Fancybox彈出窗口始終在頂部滾動

問題描述

2 個解決方案

解決方案1
0 2015-06-13 15:12:04

解決方案2
0 已采納 2015-06-13 15:29:58

Fancybox彈出窗口始終在頂部滾動

問題描述

2 個解決方案

解決方案1 0 2015-06-13 15:12:04

解決方案2 0 已采納 2015-06-13 15:29:58

解決方案1
0 2015-06-13 15:12:04

解決方案2
0 已采納 2015-06-13 15:29:58