Style backgroundAttachment attribute

Definition and usage

backgroundAttachment Attribute settings or return whether the background image should scroll with the content or be fixed.

See also:

HTML Styles:background property

CSS Tutorial:CSS Background

CSS Reference Manual:background-attachment property

Example

Example 1

Set the background image to fixed (does not scroll):

document.body.style.backgroundAttachment = "fixed";

Try it yourself

Example 2

Select scroll and local on the DIV element:

document.getElementById("myDIV").style.backgroundAttachment = "local";

Try it yourself

Example 3

Toggle between scroll and fixed:

var x = document.body.style.backgroundAttachment;
document.body.style.backgroundAttachment = (x == "scroll")? "fixed":"scroll";

Try it yourself

Example 4

Return the value of the background-attachment property:

alert(document.body.style.backgroundAttachment);

Try it yourself

Syntax

Return the backgroundAttachment property:

object.style.backgroundAttachment

Set the backgroundAttachment property:

object.style.backgroundAttachment = "scroll|fixed|local|initial|inherit"

Attribute value

Value Description
scroll The background scrolls with the element. Default.
fixed The background is fixed relative to the viewport.
local The background scrolls with the content of the element.
initial Set this property to its default value. See initial.
inherit Inherit this property from its parent element. See inherit.

Technical details

Default value: scroll
Return value: A string that indicates how the background image is attached to the objects in the document.
CSS version: CSS1

Browser support

backgroundAttachment It is a feature of CSS1 (1996).

All browsers fully support it:

Chrome Edge Firefox Safari Opera IE
Chrome Edge Firefox Safari Opera IE
Support Support Support Support Support Support