Magnific Popup - 更高的mfp-bottom-bar导致最大图像高度问题

Question

我通过使用'更改'回调自定义Magnific弹出/灯箱的标题以包含多行内容,并修改内容

this.content 

在回调中.它工作正常,除了如果弹出窗口中的图像很高,或者窗口重新调整到较小的高度这一事实,Magnific正在做的调整图像的"最大高度"的计算似乎只考虑标题的单行文本.

有谁知道调整图像的最大高度计算需要什么来考虑更高的标题框？

谢谢

**编辑

快速入侵"updateSize:"回调中第461行附近的jquery.magnific-popup.js让我可以解决这个问题.这个弹出窗口/灯箱接受最大高度百分比似乎是合理的,这样它就不会填满屏幕.

这是我的变化,如果可能的话,我会很感激.谢谢!

updateSize: function(winHeight) {

    if(mfp.isIOS) {
        // fixes iOS nav bars https://github.com/dimsemenov/Magnific-Popup/issues/2
        var zoomLevel = document.documentElement.clientWidth / window.innerWidth;
        var height = window.innerHeight * zoomLevel;
        mfp.wrap.css('height', height);
        mfp.wH = height;
    } else {
        mfp.wH = winHeight || _window.height();
        // ########################################
        // CHANGE IS RIGHT HERE TO FORCE 80% height
        // ########################################
        mfp.wH *= 0.8;
    }
    // Fixes #84: popup incorrectly positioned with position:relative on body
    if(!mfp.fixedContentPos) {
        mfp.wrap.css('height', mfp.wH);
    }

    _mfpTrigger('Resize');

},

Answer 1

您可以在调整大小回调中限制图像的最大高度,这将为标题留出更多空间:

$('a.magnific').magnificPopup({
    type: 'image',
    callbacks: {
        resize: function() {
            var img = this.content.find('img');
            img.css('max-height', parseFloat(img.css('max-height')) * 0.95);
        }
    }
});