JS 如何获取和监听屏幕方向的改变

大概写一下：

方法一：用触发手机的横屏和竖屏之间的切换的事件

代码如下：

windowaddEventListener("orientationchange", function() {

// 宣布新方向的数值

alert(windoworientation);

}, false);

方法二：监听调整大小的改变

代码如下:

windowaddEventListener("resize", function() {

// 得到屏幕尺寸 (内部/外部宽度，内部/外部高度)

}, false);

css判断横竖屏幕

代码如下:

@media screen and (orientation:portrait) {

/ portrait-specific styles /

}

/ landscape /

@media screen and (orientation:landscape) {

/ landscape-specific styles /

}

本地windowmatchMedia方法允许实时媒体查询。我们可以利用以上媒体查询找到我们是处于直立或水平视角：

代码如下:

var mql = windowmatchMedia("(orientation: portrait)");

// 如果有匹配，则我们处于垂直视角

if(mqlmatches) {

// 直立方向

alert("1")

} else {

//水平方向

alert("2")

}

// 添加一个媒体查询改变监听者

mqladdListener(function(m) {

if(mmatches) {

// 改变到直立方向

documentgetElementById("test")innerHTML="改变到直立方向";

}

else {

documentgetElementById("test")innerHTML="改变到水平方向";

// 改变到水平方向

}

});

javascript screen对象获取屏幕宽高如alert(screenheight)

availHeight 属性 -- 窗口可以使用的屏幕高度，单位像素

availWidth 属性 -- 窗口可以使用的屏幕宽度，单位像素

colorDepth 属性 -- 用户浏览器表示的颜色位数，通常为32位(每像素的位数)

pixelDepth 属性 -- 用户浏览器表示的颜色位数，通常为32位(每像素的位数)（IE不支持)

height 属性 -- 屏幕的高度，单位像素

width 属性 -- 屏幕的宽度，单位像素

div设置定位,宽度高度设为屏幕一般半即可，至于居中的话可以绝对定位。

以上就是关于JS 如何获取和监听屏幕方向的改变全部的内容，包括:JS 如何获取和监听屏幕方向的改变、js怎么让body高度自适应手机屏幕、等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！