开发者社区> 问答> 正文

如何在横向设备上加载android方向检测这个功能?

下面的代码用来在android设备上检测方向,在旋转设备上加载样式表时很好用,但是如果设备是横向的(在JS中是90 / -90) ,下面的代码就不对了。如何在横向设备上加载android 方向检测这个功能呢?

 //detect orientation change
var supportsOrientationChange = "onorientationchange" in window,
orientationEvent = supportsOrientationChange ? "orientationchange" : "resize";
    window.addEventListener(orientationEvent, function() {
        if(window.orientation == 90) {

            $('link[title=android]')[0].disabled=true;
            $("head").append($("<link title='android_90' rel='stylesheet' href='css/android_90.css' type='text/css' />"));
        } else if (window.oreintation == -90) {

            $('link[title=android]')[0].disabled=true;
            $("head").append($("<link title='android_90' rel='stylesheet' href='css/android_90.css' type='text/css' />"));
        } else if (window.oreintation == 0){

            $('link[title=android_90]')[0].disabled=true;
            $("head").append($("<link title='android' rel='stylesheet' href='css/android.css' type='text/css' />"));
        } else if (window.oreintation == 180){

            $('link[title=android_90]')[0].disabled=true;
            $("head").append($("<link title='android' rel='stylesheet' href='css/android.css' type='text/css' />"));
        }
    }, false);

    //check on window.load
    $(document).ready(function () {
      if(window.orientation == 90) {

            $('link[title=android]')[0].disabled=true;
            $("head").append($("<link title='android_90' rel='stylesheet' href='css/android_90.css' type='text/css' />"));
        } else if (window.oreintation == -90) {

            $('link[title=android]')[0].disabled=true;
            $("head").append($("<link title='android_90' rel='stylesheet' href='css/android_90.css' type='text/css' />"));
        } else if (window.oreintation == 0){

            $('link[title=android_90]')[0].disabled=true;
            $("head").append($("<link title='android' rel='stylesheet' href='css/android.css' type='text/css' />"));
        } else if (window.oreintation == 180){

            $('link[title=android_90]')[0].disabled=true;
            $("head").append($("<link title='android' rel='stylesheet' href='css/android.css' type='text/css' />"));
        }
    });

展开
收起
吴孟桥 2016-03-26 14:20:41 2160 0
1 条回答
写回答
取消 提交回答
  • 使用 $('link[title=android]').get(0) 代替 $('link[title=android]')[0]

    2019-07-17 19:16:10
    赞同 1 展开评论 打赏
问答排行榜
最热
最新

相关电子书

更多
58同城Android客户端Walle框架演进与实践之路 立即下载
Android组件化实现 立即下载
蚂蚁聚宝Android秒级编译——Freeline 立即下载