开发者

onload android orientation detection? (code supplied)

开发者 https://www.devze.com 2023-03-07 00:04 出处:网络
So i found some handy code on SO about checking oreintation on android devices, that worked great for loading style sheets based on the rotation of the device, but my issue now is that if the device i

So i found some handy code on SO about checking oreintation on android devices, that worked great for loading style sheets based on the rotation of the device, but my issue now is that if the device is already "landscape" (90 / -90 in the JS) then it ignores the rules from the code below, so i need the code below to run onload, i have attempted it but it seems i just cant get it right.

Help please ?

        //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){

                $('li开发者_运维技巧nk[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' />"));
            }
        });


Ok,

as I said in the comment, there is a condition problem :

if(window.orientation == 90)

with the double =

Don't be too hard with yourself, Practice makes perfect

Edit : I'm not too sure about : $('link[title=android]')[0]

would have used $('link[title=android]').get(0) instead

0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号