• 屏幕旋转问题小结


    一、竖屏转横屏问题

    <!-- uc强制竖屏 -->
    <meta name="screen-orientation" content="portrait">
    <!-- QQ强制竖屏 -->
    <meta name="x5-orientation" content="portrait">
    <!-- UC强制全屏 -->
    <meta name="full-screen" content="yes">
    <!-- QQ强制全屏 -->
    <meta name="x5-fullscreen" content="true">
    <!-- UC应用模式 -->
    <meta name="browsermode" content="application">
    <!-- QQ应用模式 -->
    <meta name="x5-page-mode" content="app">
    <!-- windows phone 点击无高光 -->
    <meta name="msapplication-tap-highlight" content="no">
    <!-- 适应移动端end -->

    二、监听屏幕旋转

    4. 屏幕旋转事件:onorientationchange

    添加屏幕旋转事件侦听,可随时发现屏幕旋转状态(左旋、右旋还是没旋)。例子:

    // 判断屏幕是否旋转

    function orientationChange() {

        switch(window.orientation) {

          case 0: 

                alert("肖像模式 0,screen- " + screen.width + "; screen-height:" + screen.height);

                break;

          case -90: 

                alert("左旋 -90,screen- " + screen.width + "; screen-height:" + screen.height);

                break;

          case 90:   

                alert("右旋 90,screen- " + screen.width + "; screen-height:" + screen.height);

                break;

          case 180:   

              alert("风景模式 180,screen- " + screen.width + "; screen-height:" + screen.height);

              break;

        };<br>};

    // 添加事件监听

    addEventListener('load', function(){

        orientationChange();

        window.onorientationchange = orientationChange;

    });

  • 相关阅读:
    矩阵快速幂
    快速排序
    用闭包来实现命令模式
    闭包和面向对象设计
    闭包及其作用
    阿里笔试
    如何在节点上添加样式
    getComputedStyle与currentStyle获取样式(style/class)
    今日头条笔试
    牛客网JavaScript编程规范
  • 原文地址:https://www.cnblogs.com/dingyufenglian/p/4844532.html
Copyright © 2020-2023  润新知