Screen.onorientationchange - Web APIs
warning: this is a non-standard deprecated feature which was implemented only in firefox under a different name. use screenorientation.onchange instead. an event handler for the orientationchange events sent to the screen object. syntax screen.onorientationchange = funcref; where funcref is a reference to a function. specifications specification status comment screen orientation apithe definition of 'onorientationchange' in that specification. working draft initial definition (not present in the draft anymore) ...

Window: orientationchange event - Web APIs
the orientationchange event is fired when the orientation of the device has changed. bubbles no cancelable no interface event event handler onorientationchange example you can use the orientationchange event in an addeventlistener method: window.addeventlistener("orientationchange", function(event) { console.log("the orientation of the device is now " + event.target.screen.orientation.angle); }); or use the onorientationchange event handler property: window.onorientationchange = function(event) { console.log("the orientation of the device is now " + event.target.screen.orientation.angle); }; specifications specification status compatibility standardthe definition of 'orientationchange' in that specification. liv...

Testing media queries programmatically - CSS: Cascading Style Sheets
ner than to poll the query's result. to do this, call the addlistener() method on the mediaquerylist object, with a callback function to invoke when the media query status changes (e.g., the media query test goes from true to false): // create the query list. const mediaquerylist = window.matchmedia("(orientation: portrait)"); // define a callback function for the event listener. function handleorientationchange(mql) { // ... } // run the orientation change handler once. handleorientationchange(mediaquerylist); // add the callback function as a listener to the query list. mediaquerylist.addlistener(handleorientationchange); this code creates the orientation-testing media query list, then adds an event listener to it. after adding the listener, we also call the listener directly. this makes our list...
...(handleorientationchange); this code creates the orientation-testing media query list, then adds an event listener to it. after adding the listener, we also call the listener directly. this makes our listener perform adjustments based on the current device orientation; otherwise, our code might assume the device is in portrait mode at startup, even if it's actually in landscape mode. the handleorientationchange() function would look at the result of the query and handle whatever we need to do on an orientation change: function handleorientationchange(evt) { if (evt.matches) { /* the viewport is currently in portrait orientation */ } else { /* the viewport is currently in landscape orientation */ } } above, we define the parameter as evt — an event object. this makes sense because newe...
...he media and matches properties, so you can query these features of the mediaquerylist by directly accessing it, or accessing the event object. ending query notifications to stop receiving notifications about changes to the value of your media query, call removelistener() on the mediaquerylist, passing it the name of the previously-defined callback function: mediaquerylist.removelistener(handleorientationchange); ...

Browser detection using the user agent - HTTP
istentomediaquery = iswebkit ? function(mq, f) { if(/height|width/.test(mq.media)) mql.push([mq, f]); mq.addlistener(f), mq.addlistener(whenmediachanges); } : function(){}; var destroymediaquery = iswebkit ? ...
... { if(/height|width/.test(mq.media)) mql.push([mq, f]); mq.addlistener(f), mq.addlistener(whenmediachanges); } : function(){}; var destroymediaquery = iswebkit ? ...
...ia)) mql.push([mq, f]); mq.addlistener(f), mq.addlistener(whenmediachanges); } : function(){}; var destroymediaquery = iswebkit ? function(mq) { for (var i=0,len=mql.length|0; i<len; i=i+1|0) if (mql[i][0] === mq) mql.splice(i, 1); mq.removelistener(whenmediachanges); } : listentomediaquery; var orientationchanged = false; addeventlistener("orientationchange", function(){ orientationchanged = true; }, passive_listener_option); addeventlistener("resize", settimeout.bind(0,function(){ if (orientationchanged && !mediaqueryupdated) for (var i=0,len=mql.length|0; i<len; i=i+1|0) mql[i][1]( mql[i][0] ); mediaqueryupdated = orientationchanged = false; },0)); which part of the user agent contains the information you are looking for? as there is no uniformity ...

Managing screen orientation - Web APIs
ill always be able to read what's on the screen. while this behavior is perfectly suited for text content, there is some content that can be negatively affected by such a change. for example, games based on the orientation of the device could be messed up by such a change of the orientation. the screen orientation api is made to prevent or handle such a change. listening orientation change the orientationchange event is triggered each time the device change the orientation of the screen and the orientation itself can be read with the screen.orientation property. screen.addeventlistener("orientationchange", function () { console.log("the orientation of the screen is: " + screen.orientation); }); preventing orientation change any web application can lock the screen to suits its own needs. the screen...
...ortrait-primary, portrait-secondary, landscape-primary, landscape-secondary, portrait, landscape (see screen.lockorientation to know more about each of those values). screen.lockorientation('landscape'); note: a screen lock is web application dependent. if application a is locked to landscape and application b is locked to portrait, switching from application a to b or b to a will not fire an orientationchange event because both applications will keep the orientation they had. however, locking the orientation can fire an orientationchange event if the orientation had to be changed to satisfy the lock requirements. ...

Index - Web APIs
erty indicates how bright the screen's backlight is, on a scale from 0 (very dim) to 1 (full brightness); this value is a double-precision float. 3858 screen.mozenabled api, api:mozilla extensions, dom, deprecated, non-standard, property, reference this boolean attribute controls the device's screen. setting it to false will turn off the screen. 3859 screen.onorientationchange api, cssom view, deprecated, event handler, property, screen orientation an event handler for the orientationchange events sent to the screen object. the screenorientation.onchange handler should be used instead. 3860 screen.orientation api, cssom view, experimental, property, read-only, screen orientation, screen the orientation read-only property of the screen int...
...vent of the window interface is fired when the browser has lost access to the network and the value of navigator.online switches to false. 5048 window: online event api, event, online, reference, window the online event of the window interface is fired when the browser has gained access to the network and the value of navigator.online switches to true. 5049 window: orientationchange event api, event, reference, sensors, window, onorientationchange the orientationchange event is fired when the orientation of the device has changed. 5050 window: pagehide event api, event, history, navigation, reference, window, pagehide the pagehide event is sent to a window when the browser hides the current page in the process of presenting a different page fro...

Event reference
popuphidden popuphiding popupshowing popupshown tab events visibilitychange battery events chargingchange chargingtimechange dischargingtimechange levelchange call events alerting busy callschanged cfstatechange connecting dialing disconnected disconnecting error held, holding incoming resuming statechange voicechange sensor events compassneedscalibration devicemotion deviceorientation orientationchange smartcard events icccardlockerror iccinfochange smartcard-insert smartcard-remove stkcommand stksessionend cardstatechange sms and ussd events delivered received sent ussdreceived frame events mozbrowserclose mozbrowsercontextmenu mozbrowsererror mozbrowsericonchange mozbrowserlocationchange mozbrowserloadend mozbrowserloadstart mozbrowseropenwindow mozbrowsersecuritychange mozbrowsershowmo...
... event html5 offline the browser has lost access to the network. online event html5 offline the browser has gained access to the network (but particular websites might be unreachable). open event websocket a websocket connection has been established. open event server sent events an event source connection has been established. orientationchange event screen orientation the orientation of the device (portrait/landscape) has changed. pagehide pagetransitionevent html5 a session history entry is being traversed from. pageshow pagetransitionevent html5 a session history entry is being traversed to. paste clipboardevent clipboard data has been transferred from the system clipbo...

Screen - Web APIs
th gets the bit depth of the screen. screen.top returns the distance in pixels from the top side of the current screen. screen.width returns the width of the screen. screen.mozenabled boolean. setting to false will turn off the device's screen. screen.mozbrightness controls the brightness of a device's screen. a double between 0 and 1.0 is expected. events handler screen.onorientationchange a handler for the orientationchange event. methods screen.lockorientation lock the screen orientation (only works in fullscreen or for installed apps) screen.unlockorientation unlock the screen orientation (only works in fullscreen or for installed apps) methods inherited from eventtarget: eventtarget.addeventlistener() registers an event handler of a specific event type on the e...

Window - Web APIs
listener to the oneventname property of this interface. error fired when a resource failed to load, or can't be used. for example, if a script has an execution error or an image can't be found or is invalid. also available via the onerror property. languagechange fired at the global scope object when the user's preferred language changes. also available via the onlanguagechange property. orientationchange fired when the orientation of the device has changed. also available via the onorientationchange property. devicemotion fired at a regular interval, indicating the amount of physical force of acceleration the device is receiving and the rate of rotation, if available. deviceorientation fired when fresh data is available from the magnetometer orientation sensor about the current orientation ...

Orientation and motion data explained - Developer guides
ive extending outward from the screen. note: on a phone or tablet, the orientation of the device is always considered in relation to the standard orientation of the screen; this is the "portrait" orientation on most devices. on a laptop computer, the orientation is considered in relation to the keyboard. if you want to detect changes in device orientation in order to compensate, you can use the orientationchange event. about rotation rotation is described about any given axis in terms of the number of degrees of difference between the device's coordinate frame and the earth coordinate frame, and is measured in degrees. alpha rotation around the z axis -- that is, twisting the device -- causes the alpha rotation angle to change: the alpha angle is 0° when top of the device is pointed directly towa...

User input and controls - Developer guides
matters for your application, you can read the screen orientation state, be informed when this state changes, and able to lock the screen orientation to a specific state (usually portrait or landscape) through the screen orientation api. orientation data can be retrieved through the screen.orientation attribute or through the orientation media feature. when screen.orientation changes, the screen.orientationchange event is fired on the screen object. locking the screen orientation is made possible by invoking the screen.lockorientation method, while the screen.unlockorientation method removes all the previous screen locks that have been set. note: more information about the screen orientation api can be found in managing screen orientation. fullscreen you might need to present an element of your appli...