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

You are here: Reference > CSS > properties > browser specific extensions > -webkit-marquee-direction

-webkit-marquee-direction property

Browser support:

Specifies the scrolling direction of the marquee.

JavaScript page for this property: webkitMarqueeDirection. You can find other example(s) there.

Possible values:

One of the following values:

ahead

The contents scroll from bottom to top.

auto

Default. Depending on the value of the direction property, it scrolls the contents from right to left (direction='ltr') or left to right (if direction='rtl').

backwards

The contents scroll from right to left, if the direction of the text is set to 'ltr'.

down

The contents scroll from top to bottom.

forwards

The contents scroll from left to right.

inherit

Takes the value of this property from the computed style of the parent element.

left

The contents scroll from right to left.

reverse

The contents scroll from right to left.

right

The contents scroll from left to right.

The contents scroll from bottom to top.

Default: auto.

Example HTML code 1:

This example illustrates the use of the -webkit-marquee-direction property:

<head>
    <style>
        #myMarquee {
            border: 1px dotted #000000;
            width: 200px;
            height: 60px;
            text-align: right;
            -webkit-marquee-direction: forwards;
            -webkit-marquee-increment: 1px;
            -webkit-marquee-repetition: infinite;
            -webkit-marquee-speed: fast;
            -webkit-marquee-style: scroll;
        }
    </style>
</head>
<body>
    <marquee id="myMarquee">
        first line<br />
        second line<br />
        third line
    </marquee>
</body>