top of page
Anchor 1

Wix Tutorial - Change the color of a box, using Wix Code

Change the color of a box to predefined colors by clicking on it. You can also use this for other types of elements.

Elements:

Element:

  • box: #colorBox

Wix Code:

$w.onReady(function () {

    var arr = ['#FF762B', '#039EFF', '#ED1566', '#58E0AE'];

    let i = 0;

    $w('#colorBox').onClick(() => {

        if (i >= arr.length) {

            i = 0

            $w('#colorBox').style.backgroundColor = arr[i]

        } else {

            $w('#colorBox').style.backgroundColor = arr[i]

        }

        i++

    })

});

Demo:

Click on the box to have it change color.

Wix Code Change Color of Box
bottom of page