由於固定導航而增加頂部和底部邊距FancyBox v2

Question

我目前正在致力於一個未來會有響應的網站。該網站主要由圖片組成，點擊後將圖片加載到FancyBox中。 FancyBox的v2現在可以自動響應，並在屏幕尺寸發生變化時重新調整圖像大小等。由於我的設計的一部分，我有一個出現在頁面的頂部和底部的兩個固定橫幅，見下圖：

默認有圍繞的fancybox保證金，以便它很好風格。但是，通過添加到橫幅中的固定位置，我需要增加頂部和底部邊距。我已經瀏覽了JS源代碼，但是我不能在我的生活中找到我應該添加額外保證金的位置。在轉換等方面有各種各樣的利潤（我認爲這是我感到困惑的地方）。

從理論上講，我只需要將「x」像素數量添加到邊距，其中x是橫幅的高度。順便說一下，我不確定我會如何在響應式設計中複製這一點，因爲移動設備上的橫幅可能略微淺一些。添加邊距意味着圖像和橫幅之間會存在一個細微的差距，當前圖像會放在橫幅的後面。請參閱下面的圖像想什麼我它看起來像：

我會很感激的任何想法，其中這已經做過的/例子。

在此先感謝，亞當。

Answer 1

嘗試margin API選項

$(".fancybox").fancybox({ 
    margin: [120, 60, 20, 60] // top, right, bottom, left 
}); 

見JSFIDDLE