Created
May 29, 2012 05:55
-
-
Save GreenGeorge/2822848 to your computer and use it in GitHub Desktop.
On load detects device orientation and adds the appropriate class to body. also listens for orientation changes and does the same thing. updates a notifier div and logs to console for dev purposes
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
$(function detectOrientation(){ | |
var notifier = document.getElementById('notifier'); | |
var body = $('body'); | |
// set body class to portrait | |
function setPortrait() { | |
// notifier.innerHTML="now in portrait mode"; | |
body.addClass('portrait').removeClass('landscape'); | |
console.log( 'now in portrait mode' ); | |
}; | |
// set body class to landscape | |
function setLandscape() { | |
// notifier.innerHTML="now in landscape mode"; | |
body.addClass('landscape').removeClass('portrait'); | |
console.log( 'now in landscape mode' ); | |
}; | |
// detect orientation and set body class | |
function setOrientation() { | |
var orientation = window.orientation; | |
console.log ('current orientation : 'orientation); | |
if (orientation == 0) { | |
setPortrait(); | |
} else if (orientation == 90 || orientation == -90) { | |
setLandscape(); | |
}}; | |
// execute function | |
setOrientation(); | |
// set body class on orientation change | |
window.onorientationchange = function() { | |
setOrientation(); | |
}; | |
}); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment