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
精彩评论