我们用ul li实现了一个视频列表，一共两列，点击其中一个播放时，会将该li设置为position: fixed;width:90%;也就是变成了一个弹窗的样式。安卓手机一切正常，然而当看到苹果，我……内心一万个不相信，但是看着缩在左上角的视频，陷入了沉默。无意识的摸了下屏幕，嗯？样式又正常了？？？这是什么操作……

我命由我不由天！调整！

1、调整宽度、偏移的单位为vw，不再用百分比。这回终于看到完整的了，但是宽度仍然不对；

2、万般无奈之下，我们将这个li直接放到了body中，原来的位置先用一个空li占着。结果完美的我们想哭。这就是我们想要的啊！再将宽度等用百分比表示，样式仍然正常，可见不是因为宽度写法的问题。

总之：想要position:fixed;的元素，如果样式不符预期，不妨试一下放在body中，或许这个方法也适合你呢？

苹果手机第一次fixed没有达到预期效果，滚动下页面就正常了的更多相关文章

  1. 不同浏览器对document.documentElement和document.body的scrollheight ,scrollTop,clientHeight以及判断滚动条是否滚动到页面最底部 【转载】

    前段时间学习怎么写一个瀑布流的时候,就接触到document.documentElement和document.body的区别,然后今天查资料的时候看到这篇博客,遂转载记录在此. 两种特殊的文档属性可 ...

  2. 当滚动条滚动到页面底部自动加载增加内容的js代码

    这篇文章主要介绍了如何使用javscript实现滚动条滚动到页面底部自动加载增加页面内容,需要的朋友可以参考下..1,注册页面滚动事件,window.onscroll = function(){ }; ...

  3. 基于JQuery实现滚动到页面底端时自动加载更多信息

    基于JQuery实现滚动到页面底端时自动加载更多信息 关键代码: 代码如下: var stop=true; $(window).scroll(function(){ totalheight = par ...

  4. Selenium2学习-024-WebUI自动化实战实例-022-网站不同分辨率下页面样式展示兼容性问题解决方案 -- 设置浏览器显示区域大小（无人值守，节约测试成本的福音，BOSS 最爱）

    在 Web UI 自动化测试的过程中,通常会测试页面在不同分辨率下的显示效果,即在不同大小的显示器上全屏浏览器后的页面展示,此种测试方法需要购置不同大小的显示器,或者频繁的设置屏幕分辨率,不仅浪费了大 ...

  5. Jquery滚动到页面底部自动Ajax加载图文列表,类似图片懒加载效果,带加载效果

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. javascript&jquery 判断滚动到页面底部

      js 判断滚动到页面底部 CreateTime--2018年4月14日10:13:07 Author:Marydon 1.使用场景: 滚动到屏幕底部,触发加载分页数据请求(qq空间,手机端) 2. ...

  7. ScrollTo：实现平滑滚动到页面指定位置

    ScrollTo:实现平滑滚动到页面指定位置 ScrollTo是一款基于jQuery的滚动插件,当点击页面的链接时,可以平滑地滚动到页面指定的位置.适用在一些页面内容比较多,页面长度有好几屏的场合,本 ...

  8. vue 实现滚动到页面底部开始加载更多

    直接上代码: <template> <div class="newsList"> <div v-for="(items, index) in ...

  9. vue使用H5实现滚动到页面底部时加载数据

    使用原生vue实现瀑布流,发现无法实现小程序那种滚动到地步触发加载效果,只能自己研究了 实现效果: 实现代码: 首先添加监听滚动事件 mounted() { window.addEventListen ...

  10. jQuery+ajax实现滚动到页面底部自动加载图文列表效果

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. f-strings: Python字符串处理的瑞士军刀

    从 3.6 开始,Python 新增了一个格式化字符串的方法,称之为 f-string. 其用法就是在python原始字符串的基础上增加 f/F 前缀,以大括号 {} 标明被替换的字段. f-stri ...

  2. django中只使用ModleForm的表单验证，而不使用ModleForm来渲染

    主题 众所周知,django.forms极其强大,不少的框架也借鉴了这个模式,如Scrapy.在表单验证时,django.forms是一绝,也是面向对象的经典表现.但要用它来渲染表单那就不好玩了,除非 ...

  3. DP经典例题——LIS&LCS

    DP经典例题--LIS&LCS LCS 最长公共子序列,英文缩写为LCS(Longest Common Subsequence).其定义是,一个序列 S ,如果分别是两个或多个已知序列的子序列 ...

  4. C++可执行文件绝对路径获取与屏蔽VS安全检查

    :前言 前几天写新项目需要用到程序所在绝对路径的时候,发现网上居然一点相关分享都没有. :_pgmptr 翻箱倒柜找出了几本教程,发现了一个叫_pgmptr的东西. 进去看了一下,在stdlib.h里 ...

  5. 虚假新闻检测（CADM）《Unsupervised Domain Adaptation for COVID-19 Information Service with Contrastive Adversarial Domain Mixup》

    论文信息 论文标题:Unsupervised Domain Adaptation for COVID-19 Information Service with Contrastive Adversari ...

  6. Isaac Sim 机器人仿真器介绍、安装与 Docker [1]

    前言与参考 此文书写于: January 6, 2023, 更新于 January 6, 2023 :可能会随着时间的变化 此教程会有过时概念哦 Isaac Sim 相关参考链接: 官方文档地址 官方 ...

  7. 痞子衡嵌入式：MCUBootUtility v4.0发布，开始支持MCX啦

    -- 痞子衡维护的 NXP-MCUBootUtility 工具距离上一个大版本(v3.5.0)发布过去 9 个月了,这一次痞子衡为大家带来了版本升级 v4.0.0,这个版本主要有两个重要更新需要跟大家 ...

  8. python之路41 前端页面尝试 丑出新高度

    边框 p {/* 左边 */ font-size: 48px; border-left-width: 5px; border-left-style: dotted; /*点点边框*/ border-l ...

  9. Vue 快速入门(一)

    1.介绍 Vue(读音/vju/,类似view),是中国的大神尤雨溪开发的,为数不多的国人开发的世界顶级开源软件.是一套用于构建用户界面的渐进式框架,Vue 被设计为可以自底向上逐层应用.MVVM响应 ...

  10. 最最最常用的Git提交规范以及常用命令总结

    提交规范 为什么要制定提交规范? 便于对提交历史进行追溯,以及快速定位 代码改动的历史更加清晰 格式化的 Commit Message 才可以用于自动化输出 Change log 如何制定提交规范? ...