You are here: Reference > JavaScript > client-side > HTML DOM > properties > direction (marquee)

direction property (marquee)

Browser support:
Specifies or retrieves in which direction the marquee should scroll.
Note that the browser support of the direction property in JavaScript and the browser support of the direction attribute in HTML are different. While the direction attribute is supported by all commonly used browsers, the direction property is not supported in Safari and Google Chrome. For details, see Example 2.

Syntax:

object.direction;
You can find the related objects in the Supported by objects section below.
This property is read/write.
HTML page for this property: direction

Possible values:

String that sets or retrieves the direction of the scrolling.
One of the following values:
down
marquee scrolls down.
left
marquee scrolls left.
right
marquee scrolls right.
up
marquee scrolls up.
Default: left.

Example HTML code 1:

This example illustrates the use of the direction attribute:
<marquee id="myMarquee" style="width:200px;" direction="down">Hi There!</marquee>
Did you find this example helpful? yes no

Example HTML code 2:

This example illustrates the use of the direction property:
<head>
    <script type="text/javascript">
        function SetScrollDir (elem) {
            var marquee = document.getElementById ("myMarquee");

            // Returns the index of the selected option
            var whichSelected = elem.selectedIndex;

            if ('direction' in marquee) {
                marquee.direction = elem.options[whichSelected].text;
            } else {
                    // Google Chrome and Safari
                marquee.setAttribute ("direction", elem.options[whichSelected].text);
            }
        }
    </script>
</head>
<body>
    <marquee id="myMarquee" style="width:200px; height:150px" direction="down">Hi There!</marquee>

    <br />
    Change the scroll direction!
    <select onchange="SetScrollDir (this);" size="4">
        <option selected="selected" />down
        <option />left
        <option />right
        <option />up
    </select>
</body>
Did you find this example helpful? yes no

Supported by objects:

Related pages:

External links:

User Contributed Comments

Post Content

Post Content