AMAZING FEATURES MADE WITH WIX

Experience Genius in WIX Designs...

1. DIGITAL CLOCK

Simple digital clock made with Velo By WIX

HOUR

MINUTES

SECONDS

PM

CODE SNIPPET

$w.onReady(function () {

    showTime();

});

 

//DIGITAL CLOCK

function showTime() {

    const today = new Date();

    let hour = today.getHours();

    let min = today.getMinutes();

    let secs = today.getSeconds();

    var meridian = "AM";

 

    if (hour > 12) {

        hour = hour - 12;

        meridian = "PM";

    }

 

    min = timeDec(min);

    secs = timeDec(secs);

    hour = timeDec(hour);

 

    $w("#hr").label = hour.toLocaleString();

    $w("#min").label = min.toLocaleString();

    $w("#sec").label = secs.toLocaleString();

    $w("#mer").text = meridian;

    setTimeout(showTime, 1000);

}

 

function timeDec(x) {

    if (x < 10) { x = "0" + x }

    return x;

}

 

2. INCREMENT & DECREMENT

Increase and decrease number by 1

CODE SNIPPET

$w.onReady(function () {

    

    //INCREMENT AND DECREMENT

    $w("#addButton").onClick(() => {

        addOne();

    });

 

    $w("#subtractButton").onClick(() => {

        subtractOne();

    });

 

    var number1 = 0;

 

    function addOne() {

 

        number1++

        $w("#input1").value = number1.toString();

    }

 

    function subtractOne() {

        if (number1 > 0) {

            number1--;
        $w("#
input1").value = number1.toString();

        }

 

    }

});

3. PROGRESS BAR INCREMENT & DECREMENT

Increase and decrease number by 20

0/100

CODE SNIPPET

$w.onReady(function () {

    

    //INCREMENT AND DECREMENT

    $w("#addButton").onClick(() => {

        addOne();

    });

 

    $w("#subtractButton").onClick(() => {

        subtractOne();

    });

 

    var number2 = 0;

 

    function addOne() {

 

        number2 += 20;

        $w("#progressBar1").value = number2;

        $w("#progressCounter").text = `${number2}/100`;

    }

 

    function subtractOne() {

        if (number2 > 0) {

            number2 -= 20;
        $w("#
progressBar1").value = number2;

        $w("#progressCounter").text = `${number2}/100`;

        }

 

    }

});

More coming soon.....