博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
全屏状态下层级问题(z-index)
阅读量:7184 次
发布时间:2019-06-29

本文共 674 字,大约阅读时间需要 2 分钟。

hot3.png

有时在全屏状态下,要点击按钮有弹框出现,然而浏览器的z-index最大为

2147483647

z-index最大值:

IE FireFox Safari的z-index最大值是2147483647 。
Opera的最大值是2147483584.。
IE Safari Opera在超过其最大值时按最大值处理。
FireFox 在超过最大值时会数据溢出正负不定,但有一点可以肯定绝对不会高于2147483647层
最小值
IE FireFox Safari的z-index最小值是-2147483648
Opera的z-index最小值-2147483584
FireFox在-2147483648<=z-index<0时层不显示 在z-index<-2147483648时溢出实际数字正负不定
IE Safari Opera在z-index<0时显示,在小于其最小值时都按其最小值处理
等值时表现
各个浏览器当两个层z-index相同时,按网页代码中层出现的顺序,后出现的层高于先出现的层。
跨浏览器永远最大:2147483647
跨浏览器永远最小:Hack(”IE,Safari,Opera”:-2147483648,”FireFox”:0)

这时如果用z-index来实现将会有浏览器问题。

解决方案是 :利用继承,将要弹框的内容写在全屏的内容里面。这时全屏情况下,将要弹框的内容的层级也会继承过来,z-index的效果将相对于全屏状态下!!!

 

转载于:https://my.oschina.net/u/2306318/blog/879608

你可能感兴趣的文章
Bind和Eval的区别详解
查看>>
血拼2011中国移动开发者大会门票超低价团购!(已结束)
查看>>
Ural_1348. Goat in the Garden 2(计算几何)
查看>>
Mysql学习积累之二[网摘收藏 个人学习参考]
查看>>
[nodejs]Buffer vs String
查看>>
IIS负载均衡-Application Request Route详解第五篇:使用ARR来配置试点项目
查看>>
绿色网站设计作品
查看>>
java设置环境变量
查看>>
POJ 1987 Distance Statistics(树的点分治)
查看>>
[RxJS] Error Handling in RxJS
查看>>
销售订单行上行号LINE_SHIPMENT_OPTION_NUMBER
查看>>
善用GIMP(Linux下的Photoshop),图像处理轻松又自由
查看>>
Docker for windows 入门一(下载安装)
查看>>
AngularJs的MVC模式
查看>>
世界观的内涵是认识论模型
查看>>
Cocos2d-x 3.1.1 Lua演示样例 ActionsProgressTest(进度条)
查看>>
win 下g++ 安装、环境配置等
查看>>
android:如何通过自定义工程模板让新建的工程都默认支持lambda表达式
查看>>
js日期格式化函数
查看>>
Spring 之 控制反转(IoC), 依赖注入(DI)和面向切面(AOP)
查看>>