在使用layer控件设置弹框时, 谷歌浏览器中能正常弹出, 显示在页面中央位置. 而在火狐浏览器中, 弹框只显示标题, 并且弹框内容不显示.

在火狐浏览器中弹框的效果如下图红色方框中的弹出框所示,

但是, 在火狐浏览器中, 则出现了弹框位置跳出界面, 并且内容不显示的情况:

进入debug界面, 会发现, 无论是修改layer弹出层位置(offset), 还是设置layer弹出层的宽高(area), 都不能完美的解决问题. 而导致弹出内容不显示的根本原因则是弹出框div的上一级div的layui-layer-content高度为0.

通过漫长的修改与尝试, 最终发现是页面中缺少'<!DOCTYPE html>'导致的, 加上该标签后, 所有的问题都解决了. 在html头部加上<!DOCTYPE html>这句话的意思是，告诉浏览器编写页面所用的标记的版本

jquery-layer弹框在火狐浏览器中弹框不显示的问题的更多相关文章

  1. layer弹出层右上角的关闭按钮怎么没有显示

    问题描述:layer弹出层右上角的关闭按钮怎么没有显示,但鼠标移上去又可以点击 解决方式: 这是因为样式中需要一个图标,你的项目中缺少.解决如下:1.下载图标:http://www-x-zi-han- ...

  2. jQuery layer弹出层插件 http://layer.layui.com/直接上官网学

    在许多网站中,经常用到弹出层,有时候为了达到更好的用户体验,你将写繁琐的css跟js,这款 jquery-layer可以让你想到即可做到的web弹窗/层js组件.layer侧重于用户灵活的自定义,为不 ...

  3. layer弹出层不居中解决方案，仅显示遮罩，没有弹窗

    问题:项目中layer询问层的弹窗仅显示遮罩层,并不显示弹窗…… 原因:图片太多将layer弹窗挤出屏幕下方,看不见了…… 解决方案:让layer的弹出层居中显示 一.问题描述 用layer做操作结果 ...

  4. jQuery Layer 弹层组件

    layer是一款近年来口碑非常不错的web弹层组件,她具备全方位的解决方案,致力于服务各个水平段的开发人员,您的页面会轻松地拥有丰富友好的操作体验. 在与同类组件的比较中,layer总是能轻易获胜.她 ...

  5. jQuery uploadify在谷歌和火狐浏览器下无法上传

    原因: 由于jQuery uploadify是借助flash来实现上传的,每一次向后台发送数据流请求时,ie会自动把本地cookie存储捆绑在一起发送给服务器.但firefox.chrome不会这样做 ...

  6. jquery layer弹出层插件

    http://www.51xuediannao.com/js/jquery/jquery_layer/layer.html

  7. 【jQuery学习】写一个简单的弹框页面，火狐浏览器有弹框，但IE8没有弹框的原因？

    我也是刚学习jQuery,就从官网上下载了jQuery的包,版本是3.2.1 代码 如下: <!DOCTYPE html> <html> <head> <me ...

  8. jQuery layer[页面弹出框]

    常见接口如下: 方法名 描述 $.layer({}) 核心接口,参数是一个对象,对象属性参见上述列表.诸如layer.alert()之类的为$.layer()的包装方法. layer.v 获取版本号. ...

  9. jQuery Layer mobile 弹出层

    layer mobile是为移动设备(手机.平板等webkit内核浏览器/webview)量身定做的弹层支撑,采用Native JavaScript编写,完全独立于PC版的layer,您需要按照场景选 ...

随机推荐

  1. PDA智能设备解决方案打包及部署

    演练:打包智能设备解决方案以便进行部署 Visual Studio 2008 本演练演示如何使用 Visual Studio 将应用程序及其资源打包到一个 CAB 文件中,以便可将其部署到最终用户的智 ...

  2. android自定义view之---组合view

    最近工作比较轻松,没有什么事情干,于是进入高产模式(呃....高产似xx). 应该很多童鞋对自定义view这个东西比较抵触,可能是听网上说view比较难吧,其实自定义view并没有很难 自定义view ...

  3. Android中怎样获取SD卡路径

    很多时候我们需要将我们的数据或者apk保存到SD卡中,但是使用绝对路径可能会遇到错误,怎样解决这个问题呢?     可以通过以下方法获取SD卡的路径: Environment.getExternalS ...

  4. BezierDemo开源项目的学习

    多看多学涨姿势,no zuo nuo die做暖男 1.概述 国际惯例,首先感谢一下开源作者. 这个项目主要是实现实现qq红点拖拽的效果 地址在https://github.com/chenupt/B ...

  5. Rest api简介

    理解和使用内容协商 我们的开发者在发送一个 REST API 请求的同时,根据应用场景,针对相同的资源,可能会期待不同的返回形式. 比如,我希望根据用户客户端语言,同一个资源的内容可以返回不同的语言. ...

  6. ruby创建某些“关键字”方法别名的语法

    begin和end是ruby的关键字,但是Range中也有名称为begin和end的实例方法.现在问题来了:怎么创建它们的别名方法? 如果用class Range;alias begin_x begi ...

  7. 在java中读取配置文件信息

    public class PropertyUtil { public static final Properties PROP = new Properties(); /** * 读取配置文件的内容( ...

  8. mq常用命令

    IBM MQ常用命令   常用命令 创建队列管理器crtmqm –q QMgrName-q是指创建缺省的队列管理器删除队列管理器dltmqm QmgrName启动队列管理器strmqm QmgrNam ...

  9. Eclipse 3.5 以后安装插件很慢的解决办法

    1 .除非你需要,否则不要选择"联接到所有更新站点" 在安装对话框里有一个小复选框,其标示为"在安装过程中联接到所有更新站点从而找到所需的软件."从表面上看,这 ...

  10. Java 理论与实践: 并发集合类

    Java 理论与实践: 并发集合类 DougLea的 util.concurrent 包除了包含许多其他有用的并发构造块之外,还包含了一些主要集合类型 List 和 Map 的高性能的.线程安全的实现 ...