LayIM聊天框全屏根据浏览器高宽自适应


个人博客 地址:http://www.wenhaofan.com/article/20190410190628

问题

    由于LayIM没有处理聊天框在全屏状态下根据浏览器缩放处理高宽,所以会导致在浏览器调整高宽后不能正确的显示。

解决方法

    1.重新渲染

              在layim.js中找到popchat方法在底部添加 

 window.onresize=function(){
    layer.style(index, {
         '100%'
        ,height: '100%'
    }, true);
    resizeChat();
}
                这种有个缺点就是会有一瞬间的闪烁,因为重新渲染会比较费时    

    2.根据窗口变化动态计算

                这种方法相对于第一种来说体验就比较好,但是相比于第一种方法来说操作方便,由于只是给私单做的时候遇到了这个问题所以就直接选择了第一种,动态计算的具体操作只需要使用window.onresize监听窗口改变事件,然后copy layim.js中的resizeChat方法,修改其中的宽高计算,在window.onresize监听方法中调用即可

原文地址:https://www.cnblogs.com/fanwenhao/p/10685426.html