首页 > 其他分享 >移动端判断横竖屏状态及监听变化

移动端判断横竖屏状态及监听变化

时间:2024-05-28 14:04:40浏览次数:22  
标签:false orientation 横竖 funcA window 90 移动 监听

1、手机横竖屏状态

// 不建议使用,Deprecated
// window.orientation共有4个状态码,横屏是90和-90,竖屏是0和180。
if ([0, 180].includes(window.orientation)) {
	// 竖屏
} else if([90, -90].includes(window.orientation)){
	// 横屏
}
// 建议使用
// 判断状态时可使用`window.matchMedia`方法
// 是否是横屏,true是,false 否
window.matchMedia('(orientation: landscape)').matches
// 是否是竖屏,true是,false 否
window.matchMedia("(orientation: portrait)").matches

2、监听横竖屏切换事件

// orientationchange 不赞成使用,Deprecated
window.addEventListener('orientationchange',funcA ); // 增加监听
window.removeEventListener('orientationchange', funcA, false); // 需要时移除监听
// 建议使用
screen.orientation.addEventListener('change',funcA); // 增加监听
screen.orientation.removeEventListener('change', funcA, false); // 需要时移除监听

标签:false,orientation,横竖,funcA,window,90,移动,监听
From: https://blog.csdn.net/qq_39460057/article/details/139259019

相关文章

  • 计算属性与监听属性
    【1】计算属性计算属性大致就是这样#1计算属性是基于它们的依赖进行缓存的#2计算属性只有在它的相关依赖发生改变时才会重新求值#3计算属性就像Python中的property,可以把方法/函数伪装成属性#计算属性本质上是一个函数,它们可以通过get和set方法对属......
  • 成为MySQL DBA后,再看ORACLE数据库(二、监听与连接)
    一、监听器的启动ORACLE启动完成后,可以通过sqlplus/assysdba连接数据库,但是这个只是本地连接,无法通过tcp/ip远程访问数据库,这时候就要启动ORAClE的监听器。启动监听器的命令是lsnrctlstart,启动成功后,可以观察到1521端口也随之监听,这时候就能通过ip加端口远程访问数据库了。在......
  • 【二维路径规划】基于快速RRT-star实现二维空间移动机器人运动规划附matlab复现
     ✅作者简介:热爱科研的Matlab仿真开发者,修心和技术同步精进,代码获取、论文复现及科研仿真合作可私信。......
  • 功能实现:canvas图片缩放与移动
    <!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"/><metaname="viewport"content="width=device-width,initial-scale=1.0"/><title>canvas图片缩放与移动</ti......
  • 内网渗透之横向移动
    一、使用文件传输1.1网络共享在网络资源共享中,有admin\(系统目录共享,还有IPC\)共享,是实战中通常建立的共享连接;建立IPC$共享需要以下两个条件:1.远程主机开启了IPC连接2.远程主机的139端口和445端口开放执行以下命令就可以与远程主机建立IPC连接netuse\\10.10.10.19\IPC$......
  • (读后分享)移动Web前端高效开发实战:HTML 5 + CSS 3 + JavaScript + Webpack + React Nat
    链接:pan.baidu.com/s/1tIHXj9HmIYojAHqje09DTA?pwd=jqso提取码:jqsoHTML5新特性与应用:介绍HTML5的新特性,包括语义化标签、本地存储、设备兼容、连接特性等,并讲解如何在移动Web前端开发中充分利用这些特性提升用户体验。CSS3样式与动画设计:详细讲解CSS3的样式设计和动画效果,包......
  • JavaScript事件监听
    在JavaScript中,事件监听是一种重要的机制,用于在特定事件发生时执行特定的代码。这些事件可以是用户的交互行为(如点击、鼠标移动等),也可以是浏览器的一些特定行为(如页面加载完成、窗口大小改变等)。事件监听通常使用addEventListener方法实现。以下是一个基本的示例:javascript//......
  • Unity2d横板移动有个极小的向下的加速度
    2d横板角色移动在碰撞体边缘刚体会有个向下的极小值-1.776357e-15,如果用加速度判断一些东西会出问题,找了好久发现碰撞盒的size的x轴所影响,修改碰撞盒size的x值可以让他不触发,但值不是固定的,不同的碰撞盒有不同的值,本人初学,原因未知,求大佬解答在大概这个边缘的时候地面碰撞盒......
  • 【全开源】教育系统源码(支持微信小程序+移动端H5+安卓APP+IOS-APP)
    构建智慧教育的基石在当今信息化快速发展的时代,教育系统正面临着前所未有的变革。西陆教育系统源码,作为这一变革的先锋力量,以其卓越的性能和灵活性,为教育机构提供了全新的解决方案。一、源码的力量:定制化与可扩展性西陆教育系统源码的核心优势在于其高度的定制化和可扩展......
  • Unity (动画效果 和操控人物移动)
    前沿可以在store上选中自己的模型喜欢然后倒入到你的库中 然后场景中需要设置路线什么的要用到导航 因为天花板是头顶,不是静态的,所以把statc给取消勾选然后windows->>>Ai------>Navigation 点击level模型 然后 点击Bake然后就是烘培了导航 人物移动跟......