• js/css 检测移动设备方向的变化 判断横竖屏幕


    js/css 检测移动设备方向的变化 判断横竖屏幕

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

    window.addEventListener("orientationchange", function() {

    // 宣布新方向的数值

    alert(window.orientation);

    }, false);

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

    window.addEventListener("resize", function() {

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

    }, false);

    css判断横竖屏幕

    /* portrait */

    @media screen and (orientation:portrait) {

    /* portrait-specific styles */

    }

    /* landscape */

    @media screen and (orientation:landscape) {

    /* landscape-specific styles */

    }

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

    var mql = window.matchMedia("(orientation: portrait)");

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

    if(mql.matches) {  

    // 直立方向

    alert("1")

    } else {  

    //水平方向

    alert("2")

    }  

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

    mql.addListener(function(m) {

    if(m.matches) {

    // 改变到直立方向

    document.getElementById("test").innerHTML="改变到直立方向";

    }

    else {

    document.getElementById("test").innerHTML="改变到水平方向";

    // 改变到水平方向

    }

    });

    码农都是有尊严的 转载请注明来源,谢谢 http://www.cnblogs.com/benpao/
  • 相关阅读:
    分页查询
    PDO
    投票
    租房子
    PHP增删改查
    PHP数据访问
    PHP三大特性-继承
    PHP三大特性-封装
    PHP面向对象
    循环语句(2)
  • 原文地址:https://www.cnblogs.com/benpao/p/3434128.html
Copyright © 2020-2023  润新知