IOS上z-index和fixed定位无效

最新推荐文章于 2024-01-11 18:01:45 发布
最新推荐文章于 2024-01-11 18:01:45 发布
阅读量243 收藏 1
点赞数 2
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/loverlanxin/article/details/116542377
版权

工作中偶然遇见IOS上z-index失效了，后来查阅资料，最终解决了，在元素上加上：

-webkit-transform:translateZ(1px);
-moz-transform:translateZ(1px);
-o-transform:translateZ(1px);
transform:translateZ(1px);

即可解决

素雪玉
关注
  • 2
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
关于z-index 层级显示 ios端不生效问题。
01-03
项目构建 webpack + vue + vue-router + vueX + axios + antd of vue 起因 构建项目的时候由于 采用的 antd of vue ui库 ，里面没有类似点击唤醒遮罩层的组件 ，所以自己手写vue组件进行引入 ，主要用的是 css3 z-index 属性 ，通过z-index 值不同进行层级展示。（ ps ：之前处理过类似需求 ，由于用的是vant-ui）里面有自带的组件 所以就引入直接拿来用了。 经过 自认为写的写的代码上面逻辑是没有错误的，可结果却是 以下 。。。。 出现弹窗的时候，滑动底部z-index 属性不起作用。 更令人无语的
z-index 和 fixed 在苹果手机ios不生效
MichaelAn的博客
09-11 2688
z-index 和 fixed 在苹果手机ios不生效 问题描述 今天开发遇到一个问题： 当一个元素固定定位时（fixed），同层级节点如果不想被固定定位的元素覆盖，那么需要设置 z-index，这样就不会被覆盖了。 举个例子：A是固定定位的元素，B不能被A覆盖，所以需要设置 B z-index（同时需要设置 position: relative，因为Z-index 必须在定位的元素上才能生效）。 .a { position: fixed; top: 100px; left: 100px; }
Safari 定位fixed下，z-index层级失效问题
Jensonhui's Blog
09-20 4798
在Safari浏览器下，此Safari浏览器包括iOS的Safari，iPhone上的微信浏览器，以及Mac OS X系统的Safari浏览器，当我们使用3D transform变换的时候，如果祖先元素没有overflow:hidden/scroll/auto等限制，则会直接忽略自身和其他元素的z-index层叠顺序设置，而直接使用真实世界的3D视角进行渲染。 解决方案： 方法1： 父级...
在ios上z-index不起作用问题的总结
时清云的博客
01-11 809
最近在维护一个H5老项目时，遇到一个问题，就是在ios上z-index不起作用，在安卓上样式都是好的。项目的架构组成是vue2.x + vux + vuex + vue-router等用的UI组件库是vux在页面中有一个功能点，就是点选择公司列表的时候，会出现这个页面上面浮现一个a弹框页面，这个a弹框页面里面有搜索框，可以输入公司名进行搜索，然后出现公司列表，点击其中的一个公司，就算进行选择了。主要是基于vux这个UI组件库的特性造成了这个问题；基础代码如下：
CSS 定位之 z-index 问题分析
01-19
关于z-index，目前遇到的一些问题 1. 某些浏览器下元素层级遮盖存在bug; 2. 某个元素z-index设的太大，导致始终无法被遮盖; 3. js动态计算z-index，导致元素覆盖关系部可控   层级遮盖bug出现的原因： IE6/7对z-...
IOS 中UIKit-UIPageControl利用delegate定位圆点位置
08-30
主要介绍了IOS 中UIKit-UIPageControl利用delegate定位圆点位置 的相关资料,需要的朋友可以参考下
iOS开发系列--地图与定位源代码详解
09-01
本篇文章主要介绍了iOS开发系列--详解地图与定位，具有一定的参考价值，有需要的可以了解一下。
safrai浏览器z-index无效，失效，ios端z-index失效，无效问题解决办法
01-08 2492
首先要明白一点，safrai浏览器是把z-index直接忽略了，直接忽略，忽略，不是别的，记住这个再看下面 个人傻瓜式理解： 谷歌，火狐等浏览器都是直接将一个盒子一个盒子理解成一块一块的，想分层就按照你的z-index高低来区分， 而safari不是，safari是将整个浏览器的页面看成一个整体，虽然也是一块一块的，但是他的分层是按照视觉感来分层的，它认为在下面的代码块总比在上面的代码块离人的眼...
position ： fixed z-index 失效
tao__f的博客
02-24 927
如图： 登录组件fixed 显示在上层 bug： 父组件设置了fixed 而登录组件（子组件）z-index无论设置多大都没效果 解决： 父组件设置z-index so，请注意下面两点： z-index只有在设置了position为relative,absolute,fixed时才会有效。 z-index的“从父原则”。当你发现把z-index设的多大都没用时，看看其父元素是否设置了有效的z-index，当然别忘了先看看自身是否设置了position。 ...
iOS中多个position:fixed中z-index失效导致的坑
热门推荐
zilvzsy的博客
01-07 1万+
记笔记，免忘记！ios苹果手机，多个position:fixed导致层级关系失效，弹窗无法显示。怎么调试都无法实现，部分苹果手机不会出现此问题。 首先，排除了浮动等会导致出现这个问题的情况。后网上百度了下，说是从父原则但是我按照这篇文章的说法修改样式js还是无效。因为是z-index属性失效导致了该问题，如下是正确解决了我此时的问题的方法 方法一： 页面上加上 iOS的弹性滑动属性-we...
Markdown学习笔记
04-30
Markdown学习笔记
热塑性弹性体，全球前21强生产商排名及市场份额.docx
04-30
热塑性弹性体，全球前21强生产商排名及市场份额
配合eclipse svn插件subclipse-4.3.4版本的javahl
04-30
配合eclipse svn插件subclipse-4.3.4版本的javahl，将其中的features和plugins目录解压到与subclipse-4.3.4插件同一目录下即可。在eclipse 4.31版本上验证有效。
一个基于epoll的多线程 linux c http web服务器.zip
04-30
一个基于epoll的多线程 linux c http web服务器.zip
Bash脚本教程：优雅地管理Java应用.zip
04-30
本Bash脚本用于自动化管理Java JAR应用的启动、停止及监控。首先检查JAR进程是否在运行，如在运行则安全终止。随后，使用预设的Java参数启动JAR文件，并将输出和错误日志重定向至日志文件。启动后，脚本持续监控JAR进程状态，确保其在预设时间内成功启动。本脚本提供了灵活的配置和错误处理机制，为Java应用的运维管理带来了便捷与可靠性。
嗨淘V12刷任务点赞系统源码+手动派单版本.rar
最新发布
04-30
嗨淘V12刷任务点赞系统源码+手动派单版本.rar嗨淘V12刷任务点赞系统源码+手动派单版本.rar
Bash脚本教程：Java JAR应用快速启动与监控.zip
04-30
本Bash脚本用于自动化管理Java JAR应用的启动、停止及监控。首先检查JAR进程是否在运行，如在运行则安全终止。随后，使用预设的Java参数启动JAR文件，并将输出和错误日志重定向至日志文件。启动后，脚本持续监控JAR进程状态，确保其在预设时间内成功启动。本脚本提供了灵活的配置和错误处理机制，为Java应用的运维管理带来了便捷与可靠性。
秒懂傅里叶变换matlab程序实现过程
04-30
秒懂傅里叶变换matlab程序实现过程
ios z-index
09-08
在 iOS 开发中，z-index（层叠顺序）用于控制视图元素的显示顺序。iOS 使用 CALayer 来管理视图层级，每个 CALayer 对象都有一个 zPosition 属性来确定其在层次结构中的位置。 默认情况下，iOS 视图的层叠顺序是...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值