Interface Options

An interface for options used when initializing a background changer. It is passed to the create function or a bRando class constructor.

Hierarchy

  • Options

Properties

CSSSelector?: string

Sets the CSS selector used when selecting elements to change backgrounds on; multiple element selections are supported. e.g. "main"

Default Value

"body"

backgrounds?: string[]

Sets an array of CSS backgrounds to be used. e.g. ["red","green","blue"]

Default Value

An array of demo CSS backgrounds

random?: boolean

Sets whether to pick the next background value at random (true) or sequentially (false).

Default Value

true

timeout?: number

Sets the time between background changes (in milliseconds). e.g. 5000

Remarks

Timing Values

Never set the transition duration longer than the timeout.

// DO NOT SET transition > timeout

// Bad
const options = {
transition: "5000ms", // transition duration set to 5 seconds
timeout: 3000, // time between backgrounds set to 3 seconds
...
}

// Bad
bgChanger.transition = "5000ms"; // transition duration set to 5 seconds
bgChanger.timeout = 3000; // time between backgrounds set to 3 seconds

If it is longer, the transition to a new background will not complete before the next background is set, causing background changes to glitch past animations.

Default Value

7500

transition?: string

Sets the CSS transition (without a transition-property) used when changing between backgrounds. e.g. "500ms ease-in" or "0.5s ease-in-out 0.25s"

Remarks

Timing Values

Never set the transition duration longer than the timeout.

// DO NOT SET transition > timeout

// Bad
const options = {
transition: "5000ms", // transition duration set to 5 seconds
timeout: 3000, // time between backgrounds set to 3 seconds
...
}

// Bad
bgChanger.transition = "5000ms"; // transition duration set to 5 seconds
bgChanger.timeout = 3000; // time between backgrounds set to 3 seconds

If it is longer, the transition to a new background will not complete before the next background is set, causing background changes to glitch past animations.

Default Value

"5000ms"

Generated using TypeDoc