推广 热搜: page  关键词  红书  搜索  链接  哪些  数据分析  服务  获取  数据 

手机屏幕旋转事件监听与处理手机怎么调横竖屏「手机屏幕旋转事件监听与处理」

   日期:2025-02-17     作者:s14ol    caijiyuan   评论:0    移动:https://sicmodule.kub2b.com/mobile/news/16562.html
核心提示:         在项目开发中发现,屏幕旋转旋转后html界面出现了不同的显示效果,如果在屏幕旋转后重新加载一次界面

         在项目开发中发现,屏幕旋转旋转后html界面出现了不同的显示效果,如果在屏幕旋转后重新加载一次界面的话就会显示的相对来说能接受一点,为此如果能监听到屏幕发生了旋转后进行相关的回调处理,则问题会得到解决,从网上搜索了大半天,并进行相关的测试后,有小的收获,仅以记之。

        可以参考这篇论坛: html5屏幕旋转事件  ,测试的时候按照@media 的css可以实现相关的body颜色改变效果,其他的方法在浏览器中没有测试成功,或许是没有在手机上进行测试缘故。

       下面的代码再手机上进行测试后,测试通过。

      html页面如下

     上面的代码是创建了一个cordova 项目后在主页面的index.html里面添加了测试代码,就是script标签里面的代码. 

     手机浏览器支持orientationchange 事件(屏幕旋转事件) 和 window.orientation属性(屏幕旋转角度

    orientation 可能值有 0 (默认竖屏-90(向右旋转,90 (向左旋转)三个可选项。

关键代码

      测试使用的是android设备,在ios没有进行测试。 

     补充说明:关于手机横竖屏,屏幕选转的问题,以及屏幕适配的问题,在开发中都是要进行考虑的,为的是更好的用户体验,当然也可以在浏览器中固定屏幕的朝向,在游戏开发中很重要。不同的平台有不同的处理机制,比如使用以下js可以实现解除屏幕旋转锁定(屏幕可以进行旋转,和固定屏幕旋转。

 
 具体的相关其他细致用法,可以进行相关的搜索与研究。 

     小结:有些特定的功能,只有在真机上进行相关的测试后才能证明(代码没有逻辑错误,在浏览器中则没有相关的效果,这需要我们多多摸索,多多尝试,这也是开发进行测试的意义所在。


  

如有不妥不正确之处,希望批评指出,相互学习,共同进步!











本文地址:https://sicmodule.kub2b.com/news/16562.html     企库往 https://sicmodule.kub2b.com/ , 查看更多

特别提示:本信息由相关用户自行提供,真实性未证实,仅供参考。请谨慎采用,风险自负。

 
 
更多>同类最新资讯
0相关评论

文章列表
相关文章
最新动态
推荐图文
最新资讯
点击排行
网站首页  |  关于我们  |  联系方式  |  使用协议  |  版权隐私  |  网站地图  |  排名推广  |  广告服务  |  积分换礼  |  网站留言  |  RSS订阅  |  违规举报  |  鄂ICP备2020018471号