jquery3和layui冲突导,致使用layui.layer.full弹出全屏iframe窗口时高度152px问题

项目中使用的jquery版本是jquery-3.2.1,在使用layui弹出全屏iframe窗口时,iframe窗口顶部总是出现一个152px高的滚动窗口无法实现真正全屏,代码如下:

<!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">
</head>
<body><script src="layui/layui.js"></script>
<script>
//一般直接写在一个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>

就是因为头部引入了 jquery-3.2.1.min.js导致iframe窗口无法全屏,效果如下

 

解决办法:

方法一.使用layui内置的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.js"></script><link rel="stylesheet" href="layui/css/layui.css">
</head>
<body><script src="layui/layui.js"></script>
<script>
//一般直接写在一个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>

 

转载于:https://www.cnblogs.com/a2b1/p/10850598.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/364614.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

ADF Faces。 立即的自定义客户端事件

在本文中&#xff0c;我将重点介绍ADF Faces Javascript API方法以从客户端触发自定义事件。 例如&#xff1a; function cliListener(actionEvent) {AdfCustomEvent.queue(actionEvent.getSource(), "servListener",null, true);}我们可以使用af&#xff1a;client…

react-native页面间传递数据的几种方式

1. 利用react-native 事件DeviceEventEmitter 监听广播 应用场景&#xff1a; - 表单提交页面&#xff0c; A页面跳转到B页面选人&#xff0c; 然后返回A页面&#xff0c; 需要将B页面选择的数据传回A页面。 - 多个多媒体来回切换播放&#xff0c;暂停后二次继续播放等问题。…

php数据库操作类的调用优化,PHP PDO优化数据库操作类 多数据库驱动类

就是做一下整理 PHP PDO类操作。简化操作流程更多内容http://git.oschina.net/youkuiyuan/yky_test/blob/master/class/pdo.class.php点击链接加入群【微信开发探讨群】&#xff1a;http://jq.qq.com/?_wv1027&kcsNcd9群号&#xff1a;330393916欢迎浏览&#xff1a;www.z…

Genymotion模拟器安装ARM架构编译应用失败解决方案

我们在安装一些应用到Genymotion模拟器会提示&#xff1a;adb: failed to install xx.apk: Failure [INSTALL_FAILED_NO_MATCHING_ABIS: Failed to extract native libraries, res-113] 原因是Genymotion采用的编译方式是x86&#xff0c;默认不支持ARM架构编译的应用&#xff0…

CentOS7.5 yum 安装与配置MySQL5.7.24

安装环境&#xff1a;CentOS7 64位 MINI版&#xff0c;安装MySQL5.7 1、配置YUM源 在MySQL官网中下载YUM源rpm安装包&#xff1a;https://dev.mysql.com/downloads/repo/yum/ 下面已经提供一个YUM源安装包,如果不需要特定版本可直接使用我提供的5.7.24版本 # 下载mysql源安装包…

5种改善服务器日志记录的技术

在最近的时间里&#xff0c;我们已经看到了许多工具可以帮助您理解日志。 诸如Scribe和LogStash之类的开源项目&#xff0c;诸如Splunk之类的本地工具以及诸如SumoLogic和PaperTrail之类的托管服务。 这些都可以帮助您将大量日志数据减少为更有意义的内容。 它们共有一个共同点…

在vue项目中引用element-ui时 让el-input 获取焦点的方法

在制作项目的时候遇到一个需求&#xff0c;点击一个按钮弹出一个input输入框&#xff0c;并让输入框获得焦点&#xff0c;项目中引用了element-ui 在网上查找了很多方法&#xff0c;但是在实际使用中发现了一个问题无论是使用$ref获取input元素然后使用focus方法还是使用饿了么…

java excel处理框架,Java三方—-excel框架之POI的使用一

Apache POI是Apache软件基金会的开放源码函式库&#xff0c;POI提供API给Java程序对Microsoft Office格式档案读和写的功能。pdf框架之IText的使用&#xff0c;参见我的博客&#xff1a;Java三方—->pdf框架之IText的使用。今天我们开始POI中Excel部分的学习。POI框架的简单…

关于background-*的一些属性

1、盒模型 盒模型从外到内一次为&#xff1a;margin-box、border-box、padding-box、content-box。 2、一些属性设置的相对位置 ⑴background-position的属性值&#xff08;top/right/bottom/left/center&#xff09;起始位置是相对于padding-box外边沿开始的&#xff0c;…

设计模式:不可变的嵌入式构建器

上周&#xff0c;我写了关于什么使图案成为反图案。 本周&#xff0c;我提出一种设计模式…或等待……也许这是一种反模式。 还是&#xff1f; 让我们看看&#xff01; 当有一个类可以构建另一个实例时&#xff0c;构建器模式是一种编程样式。 构建器模式的最初目的是将对象的…

Outlook邮件的右键菜单中添加自定义按钮

customUI代码如下&#xff1a; <customUI xmlns"http://schemas.microsoft.com/office/2009/07/customui"><contextMenus><contextMenu idMso"ContextMenuMailItem"> <button id"button1" label"修改件名"…

vue 项目的I18n国际化之路

I18n (internationalization ) ---未完善 产品国际化是产品后期维护及推广中重要的一环&#xff0c;通过国际化操作使得产品能更好适应不同语言和地区的需求 国际化重点&#xff1a;1、 语言语言本地化2、 文化颜色、习俗等3、 书写习惯日期格式、时区、数字格式、书写方向备…

华中师范大学邮箱matlab,18春[华中师范大学]华师《Matlab基础与应用》在线作业1(100分)...

试卷总分:100 得分:100第1题,用round函数四舍五入对数组[2.48 6.39 3.93 8.52]取整&#xff0c;结果为( )。A、[2 6 3 8]B、[2 6 4 8]C、[2 6 4 9]D、[3 7 4 9 ]第2题,下列变量名中( )是合法的。A、char_1B、x*yC、x\yD、end第3题,指出下列错误的指令是( )。A、syms a b;…

nginx 篇

nginx 安装 下载必要组件 nginx下载地址 http://nginx.org/en/download.htmlpcre库下载地址&#xff0c;nginx需要 http://sourceforge.net/projects/pcre/files/pcre/zlib下载地址&#xff0c;nginx需要 http://www.zlib.net/openssl下载地址&#xff0c;nginx需要 https://gi…

使用IAM保护您的AWS基础架构

在开发新产品并发现合适的产品市场时&#xff0c;每个团队都需要快速行动。 尤其是初创公司&#xff0c;因为公司的整个未来都取决于快速找到为您的产品付款的人。 对于初创企业和其他团队来说&#xff0c; Amazon Web Services是令人难以置信的工具&#xff0c;可以快速构建其…

Linux命令集锦:tmux命令

tmux是一款优秀的终端复用软件&#xff0c;平时用到的强大功能有下面两个&#xff1a; 窗口管理&#xff1a;同时启用多个窗口&#xff1b; 保护现场&#xff1a;连接到远程主机之后&#xff0c;一旦断开&#xff0c;那么当前账户登录的任务就被取消了&#xff0c;但是使用 tmu…

一个页面从输入URL到加载显示完成,发生了什么?

面试经典题——URL加载 一、涉及基本知识点&#xff1a; 1. 计算机网络 五层因特尔协议栈&#xff1a; 应用层&#xff08;dns、http&#xff09;&#xff1a;DNS解析成IP并完成http请求发送&#xff1b;传输层&#xff08;tcp、udp&#xff09;&#xff1a;三次握手四次挥手…

mysql文件软连接失败,解决打包软链接打包失败问题

一般情况下打包文件时&#xff0c;如果直接打包软连接会导致打包失败&#xff0c;即没有将要打包的内容打包进去&#xff0c;这里提供tar打包参数-h[rootlocalhost ~]# ll /etc/rc.locallrwxrwxrwx. 1 root root 13 Nov 24 00:45 /etc/rc.local -> rc.d/rc.local[rootlocalh…

快速掌握前端 专为Java程序员定制

Javascript 例子 修改页面内容 js 代码位置 <script>// js 代码 </script>引入 js 脚本 <script src"js脚本路径"></script>注意&#xff0c;到了框架之后&#xff0c;引入方式会有不同 1. 变量与数据类型 声明变量 1) let ⭐️ l…

实施Jersey 2 Spring集成

Jersey是Oracle提供的出色的Java JAX-RS规范参考实现。 去年&#xff0c;当我们开始为大容量网站构建RESTful后端Web服务时&#xff0c;我们选择使用JAX-RS API作为我们的REST框架和Spring框架来进行依赖项注入。 泽西岛是我们选择的JAX-RS实现。 项目启动时&#xff0c;JAX-R…