In order to access this site you need to enable JavaScript!

You are here: Reference > JavaScript > client-side > style handling > methods > appendMedium (mediaList)

appendMedium method (mediaList)

Browser support:

9

Adds a media type to the mediaList collection.

Note: The mediaList object and its appendMedium method are supported in Internet Explorer from version 9.

Media types are the target devices for style properties.
Media types can be specified for the @import and media at-rules in CSS, or by the media property for the style and link elements.

Syntax:

object.appendMedium (mediumType);

You can find the related objects in the Supported by objects section below.

Parameters:

mediumType

String that specifies the type of the media to add.

One of the following values:

all

Default. For all media.

aural

Speech synthesizers.

braille

Braille tactile feedback devices.

embossed

Paged braille printers.

handheld

Handheld devices.

Printed pages and print preview.

projection

Projectors or print to transparencies.

screen

Color computer screens.

speech

Intended for speech synthesizers.

tty

Teletypes.

Television-type devices.

Return value:

This method has no return value.

Example HTML code 1:

This example illustrates the use of the appendMedium method.

<head>
    <style id="myStyle">
        @media print {
            body {
                font-size: 13px;
                color: #FF0000;
            }
          }
    </style>
    
    <script type="text/javascript">
        function AddScreenMedia () {
            var styleTag = document.getElementById ("myStyle");

                // the style sheet in the style tag
            var sheet = styleTag.sheet ? styleTag.sheet : styleTag.styleSheet;

            if (sheet.cssRules) {   // all browsers, except IE before version 9
                var rule = sheet.cssRules[0];
                var mediaList = rule.media;

                alert ("The media types before adding the screen media type: " + mediaList.mediaText);
                mediaList.appendMedium ("screen");
                alert ("The media types after adding the screen media type: " + mediaList.mediaText);
            }
            else {  // Internet Explorer before version 9
                    // note: the rules collection does not contain the at-rules
                alert ("Your browser does not support this example!");
            }
        }
    </script>
</head>
<body>
    The color of this text is red on the print preview. 
    You can add these color settings to the screen with the button below.<br />
    <button onclick="AddScreenMedia ();">Add screen media</button>
</body>