jquery3和layui沖突導(dǎo)致使用layui.layer.full彈出全屏iframe窗口時(shí)高度152px問題
更新時(shí)間：2019年05月12日 08:46:24 作者：ZQC
這篇文章主要介紹了解決jquery3和layui沖突導(dǎo)致使用layui.layer.full彈出全屏iframe窗口時(shí)高度152px問題,需要的朋友可以參考下
項(xiàng)目中使用的jquery版本是jquery-3.2.1，在使用layui彈出全屏iframe窗口時(shí)，iframe窗口頂部總是出現(xiàn)一個(gè)152px高的滾動(dòng)窗口無法實(shí)現(xiàn)真正全屏，代碼如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>zqc</title>
<script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>
<link rel="stylesheet" href="layui/css/layui.css" rel="external nofollow" rel="external nofollow" >
</head>
<body>
<script src="layui/layui.js"></script>
<script>
//一般直接寫在一個(gè)js文件中
layui.use(['layer', 'form'], function(){
var layer = layui.layer
,form = layui.form;
//彈出即全屏
var index = layer.open({
type: 2,
content: 'http://layim.layui.com',
area: ['320px', '195px'],
maxmin: true
});
layer.full(index);
});
</script>
</body>
</html>
就是因?yàn)轭^部引入了 jquery-3.2.1.min.js導(dǎo)致iframe窗口無法全屏，效果如下
解決辦法：
方法一.使用layui內(nèi)置的jquery
方法二.使用jquery1.X版本，我這里事更換的jquery-1.12.4，解決后代碼如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>zqc</title>
<script type="text/javascript" src="js/jquery-1.12.4.min"></script>
<link rel="stylesheet" href="layui/css/layui.css" rel="external nofollow" rel="external nofollow" >
</head>
<body>
<script src="layui/layui.js"></script>
<script>
//一般直接寫在一個(gè)js文件中
layui.use(['layer', 'form'], function(){
var layer = layui.layer
,form = layui.form;
//彈出即全屏
var index = layer.open({
type: 2,
content: 'http://layim.layui.com',
area: ['320px', '195px'],
maxmin: true
});
layer.full(index);
});
</script>
</body>
</html>
總結(jié)
以上所述是小編給大家介紹的jquery3和layui沖突導(dǎo)致使用layui.layer.full彈出全屏iframe窗口時(shí)高度152px問題，希望對(duì)大家有所幫助，如果大家有任何疑問歡迎給我留言，小編會(huì)及時(shí)回復(fù)大家的！
相關(guān)文章
LazyForm jQuery plugin 定制您的CheckBox Radio和Select
LazyForm jQuery plugin 定制您的CheckBox Radio和Select ，需要的朋友可以參考下。2009-10-10
基于jquery的動(dòng)態(tài)創(chuàng)建表格的插件
工作快一年了,最近學(xué)習(xí)jquery，對(duì)jquery很感興趣。第一次寫博客，有不足之處還請(qǐng)各位拍磚。2011-04-04
jquery 層次選擇器siblings與nextAll的區(qū)別介紹
jquery 層次選擇器包括siblings與nextAll，本文為大家介紹下具體的使用方法，想學(xué)習(xí)的朋也可以參考下，希望對(duì)大家有所幫助2013-08-08
JS拖動(dòng)選擇table里的單元格完整實(shí)例【基于jQuery】
這篇文章主要介紹了JS拖動(dòng)選擇table里的單元格,結(jié)合完整實(shí)例形式分析了基于jQuery的table表格動(dòng)態(tài)操作相關(guān)實(shí)現(xiàn)技巧,涉及事件響應(yīng)及頁面元素屬性動(dòng)態(tài)操作使用方法,需要的朋友可以參考下2019-05-05
jquery post方式傳遞多個(gè)參數(shù)值后臺(tái)以數(shù)組的方式進(jìn)行接收
在用jquery的post方式傳遞多個(gè)值時(shí)，在后臺(tái)頁面可以用數(shù)組形式接收,很不錯(cuò)吧，可以接收多個(gè)值啊，接下來介紹實(shí)現(xiàn)方法，感興趣的朋友可以了解下哦2013-01-01
JQuery validate 驗(yàn)證一個(gè)單獨(dú)的表單元素實(shí)例
下面小編就為大家?guī)硪黄狫Query validate 驗(yàn)證一個(gè)單獨(dú)的表單元素實(shí)例。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-02-02
這篇文章主要介紹了基于bootstrap3和jquery的分頁插件的相關(guān)資料,需要的朋友可以參考下2015-07-07
jQuery擁有可操作HTML元素和屬性的強(qiáng)大方法,下面這篇文章主要給大家介紹了關(guān)于jQuery獲取文本內(nèi)容和原生JS的異同之處,文中通過示例代碼介紹的非常詳細(xì),需要的朋友可以參考下2022-05-05
基于jQuery實(shí)現(xiàn)左右圖片輪播（原理通用）
這篇文章主要介紹了基于jQuery實(shí)現(xiàn)左右圖片輪播，實(shí)現(xiàn)原理通用可通用，希望能和大家分享一下思路，感興趣的小伙伴們可以參考一下2015-12-12
瀑布流就是像瀑布一樣的網(wǎng)站——豐富的網(wǎng)站內(nèi)容，特別是絢美的圖片會(huì)讓你流連忘返。你在瀏覽網(wǎng)站的時(shí)候只需要輕輕滑動(dòng)一下鼠標(biāo)滾輪，一切的美妙的圖片精彩便可呈現(xiàn)在你面前。瀑布流網(wǎng)站是新興的一種網(wǎng)站模式——她的典型代表是pinterest、美麗說、蘑菇街這類型的網(wǎng)站。2016-01-01