layer mobile開發layer.full

Layer For Mobile 之 layer.full()

背景介紹:layer mobile是專門針對手機頁面開發的一套框架,具體介紹請看官方文檔 http://layer.layui.com/mobile/api.html ,因其擴展方法有限,我用到了layer Pc版的layer.full這裏作了擴展。css

問題:目前layer mobile是2.0版,沒有layer.full方法。由於用到作了擴展。html

包括兩部分,一部分是js,一部分是樣式。web

js部分api

function LayerFull(title, url) {
   
    layer.open({
        type: 1,
        btn: ["點擊關閉本頁面"],
        yes: function (index) {
            layer.close(index);
        },
        title: title,
        content: "<iframe src=" + url + "  width='100%' height='96%'></iframe>",
        style: 'position:fixed; left:0; top:0; width:100%; height:96%;    border: none;'
    });
 
};

css部分框架

.layui-m-layercont {
    height: 80%;
}
    .layui-m-layercont iframe {
        border: none;
        z-index: 900;
    }
.layui-m-layermain .layui-m-layerchild h3 {
    height: 30px;
    line-height: 30px;
}

/**
iOS兼容iFrame滾動條樣式
 */
.layui-m-layercont {
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
    width: 100%;
    /*height: 330px;*/
}

    .layui-m-layercont iframe {
        width: 100%;
        /*height: 80%;*/
    }
相關文章
相關標籤/搜索