StyleMedia Class Reference

Companion guide
Safari Web Content Guide
Availability
Available in Safari 5.0 and later.
Available in iOS 4.2 and later.

Overview

The StyleMedia class provides a way to evaluate CSS media queries from JavaScript. You do not need to, nor should you, create instances of this class. You access the shared StyleMedia object using the window’s styleMedia property.

Tasks

Get Properties

Make Media Queries

Properties

type

A string that represents the media type of the current view used for rendering the document. 

readonly attribute DOMString type
Discussion

For pages being displayed on screen, this property value is screen. When printing, this property value is print.

Availability

Methods

matchMedium

Evaluates the given string as a media query and returns the result.

boolean matchMedium (in DOMString mediaquery);
Parameters
mediaquery

The media query to evaluate.

Return Value

true if the media query is logically true; otherwise, false.

Discussion

For example, window.styleMedia.matchMedium("(color)") returns true if the display device is a color device. You can also use this method to check whether the browser supports 3D transforms as follows:

if ('styleMedia' in window && window.styleMedia.matchMedium("(-webkit-transform-3d)")) {
  // Insert 3D code here
}

Or check to see whether the browser supports animations as follows:

if ('styleMedia' in window && window.styleMedia.matchMedium("(-webkit-animation)")) {
  // Insert animation code here
}
Availability
  • Available in Safari 5.0 and later.
  • Available in iOS 4.2 and later.


© 2011 Apple Inc. All Rights Reserved. (Last updated: 2011-05-10)

Did this document help you? Yes It's good, but... Not helpful...