苹果手机旋转屏幕之后的问题

换句话说，当苹果手机屏幕旋转页面重新加载之后，问题就出现了。

在安卓和谷歌浏览器上正常显示的页面，在苹果手机上出岔子了。具体问题：当页面旋转后，根据父容器的高度更改一个元素的高度，代码执行了，但是没有预期的效果。

现在想来，没有想到页面旋转后会重新加载页面，是导致后续很久定位不到问题关键所在。

问题的定位过程：1.获取父容器和子容器，页面旋转后打印高度。发现打印的高度是页面旋转之前的高度，而不是页面旋转之后的高度。猜测：代码执行时页面还没加载好，dom还没全部生成。遂放在页面结构加载完后取值，但还是这样。偶然想到可能是屏幕旋转后重新加载了。百度后才搞明白。

页面加载后，html，css和js同时解析，我的js代码在页面旋转后立即执行，必然快于html.css的解析速度，当js取值时，元素的高度还没有变化。所以才有问题定位时的现象。最后是页面加载后延迟0.4秒执行，预期的效果就出来了。

几个小点：

1.angular获取dom

2.angular操作dom

3.代码重构

1.html:

<div #videoParent></div>

2.ts

@ViewChild("video1") videoParent: ElementRef;

let videoNative=this.videoParent.natveElement;

2.操作dom

render2或者直接.style.setProperty()

3.代码重构

之前尝试解决问题时，添加了很多代码，且逻辑混乱，复杂，功能也没有分离。导致一个方法非常难看。遂将可分离和重复部分分离，分装成单独函数。分离之后后续代码维护和可靠性都好了很多。

苹果手机旋转屏幕之后的问题相关推荐

linux屏幕旋转后触控不准,手机重力感应失效解决方法不能自动旋转屏幕怎么设置...
如今手机已经成为人们生活中必不可少的一个工具了,在使用过程也常常会遇到各种各样的问题,比如当手机重力感应失效的时候应该怎么解决呢,手机不能自动旋转屏幕要怎么设置,针对这个问题下面就为大家带来最新解决方 ...
android 屏幕旋转不重新加载,Android webview旋转屏幕导致页面重新加载问题解决办法...
Android webview旋转屏幕导致页面重新加载问题解决办法 1. 在create时候加个状态判断 protected void onCreate(Bundle savedInstanceSta ...
Xamarin.Android 开发中遇到旋转屏幕错误
错误信息 : System.NotSupportedException: Unable to find the default constructor on type App5.MyFragment. ...
Android 禁止屏幕旋转旋转屏幕时保持Activity内容
Android 禁止屏幕旋转 & 旋转屏幕时保持Activity内容 1.在应用中固定屏幕方向. 在AndroidManifest.xml的activity中加入: an ...
android旋转屏幕简册,[Android][旋转屏幕]
1.落笔缘由最近在研究旋转屏幕,网上可以找到资料,发现他们基本都是在Activity的基础上进行旋转.自己也想研究一下,能不能实现只旋转屏幕的内容,而不旋转屏幕上的菜单.例如,我点击屏幕上的按钮,页 ...
ios 旋转屏幕试图切换_TCL·XESS 旋转智屏 A200Pro 评测：方向一换，体验大不相同...
点击右上角关注我们,每天给您带来最新最潮的科技资讯,让您足不出户也知道科技圈大事! 对于电视,我们大多数人的概念也许是「横在客厅或者卧室的一块屏幕」.它早已经是每个人家庭装修的一部分,但也因为就一直躺 ...
vue标签旋转_vue.js编写移动端页面，检测旋转屏幕，横竖屏。
初学vue,想要在检测到旋转屏幕后显示遮罩层. 现在我的想法是在mounted时期添加监听屏幕旋转事件,如果检测到了,则修改data中的值isShowCover来改变v-show中的真假值,来达到显示 ...
【转】Unity3D研究院之设置自动旋转屏幕默认旋转方向
http://www.xuanyusong.com/archives/2871 如下图所示,在处理屏幕默认旋转方向的时候可以在这里进行选择,上下左右一共是4个方向. 策划的需求是游戏采用横屏,但是要求 ...
ios 旋转屏幕试图切换_总结iOS App开发中控制屏幕旋转的几种方式
在iOS6之前的版本中,通常使用 shouldAutorotateToInterfaceOrientation 来单独控制某个UIViewController的方向,需要哪个viewControlle ...

苹果手机旋转屏幕之后的问题

苹果手机旋转屏幕之后的问题相关推荐

最新文章

热门文章