不灭的焱

革命尚未成功,同志仍须努力

作者:php-note.com  发布于:2020-08-01 21:08  分类:HTML/CSS/JS  编辑

高度自适应方法 layer.iframeAuto(index) 能自适应增加iframe弹框高度,却不能自适应减少高度,查看github库开源代码:

https://github.com/sentsin/layer/blob/master/src/layer.js

//iframe层自适应宽高
layer.iframeAuto = function(index){
  if(!index) return;
  var heg = layer.getChildFrame('html', index).outerHeight();
  var layero = $('#'+ doms[0] + index);
  var titHeight = layero.find(doms[1]).outerHeight() || 0;
  var btnHeight = layero.find('.'+doms[6]).outerHeight() || 0;
  layero.css({height: heg + titHeight + btnHeight});
  layero.find('iframe').css({height: heg});
};

把上述中的

var heg = layer.getChildFrame('html', index).outerHeight();

改为:

var heg = layer.getChildFrame('body', index).outerHeight();

问题解决!!!

也让弹框自动居中对齐,最终修改后的代码为:

//iframe层自适应宽高
layer.iframeAuto = function(index) {
    if (!index) {
        return;
    }
    
    // 高度自适应 增加/减小  by php-note.com
    //var heg = layer.getChildFrame('html', index).outerHeight();
    var heg = layer.getChildFrame('body', index).outerHeight();
    
    var layero = $('#' + doms[0] + index);
    var titHeight = layero.find(doms[1]).outerHeight() || 0;
    var btnHeight = layero.find('.' + doms[6]).outerHeight() || 0;
    layero.css({height : heg + titHeight + btnHeight});
    layero.find('iframe').css({height : heg});
    
    // 居中对齐     by php-note.com
    //var area = [layero.outerWidth(), layero.outerHeight()];
    //var offsetTop = (win.height() - area[1]) / 2;
    //var offsetLeft = (win.width() - area[0]) / 2;
    //offsetTop = /%$/.test(offsetTop) ?
    //    win.height() * parseFloat(offsetTop) / 100
    //    : parseFloat(offsetTop);
    //offsetLeft = /%$/.test(offsetLeft) ?
    //    win.width() * parseFloat(offsetLeft) / 100
    //    : parseFloat(offsetLeft);
    //offsetTop += win.scrollTop();
    //offsetLeft += win.scrollLeft();
    //layero.css({top: offsetTop, left: offsetLeft});
    win.trigger('resize');
};