gpt4 book ai didi

counter - 如何制作数字计数器来计算 Wix Velo 中的多个元素

转载 作者:行者123 更新时间:2023-12-05 05:46:32 26 4
gpt4 key购买 nike

我正在 Wix 上制作一个网站,它有 Velo,它像 javascript 一样工作(我对编码不太了解)

我正在尝试做一个从 0 到给定数字的数字计数器,我做到了,但我需要 4 个不同的计数器,不知道该怎么做,也许有人可以帮忙。

所以我的代码是这样的

$w.onReady(function() {});

let startNum = 0;
let endNum = 145;
const duration = 20;

$w.onReady(function() {
setInterval(() => {
countUp();
}, duration);
});


function countUp() {
if (startNum <= endNum) {
$w('#StartNumber').text = startNum.toString();
startNum++;
}
}

#startnumber 是一个从 0 到 145 的文本元素我想对另外 3 个元素 #startnumber2、3 和 4 执行相同的操作。

this is what I'm trying to do

最佳答案

可以将计数逻辑提取到一个函数中,以便您可以为所有文本组件调用它。

$w.onReady(function () {
count($w('#text1'), 0, 150, 1000);
count($w('#text2'), 0, 250, 1000);
count($w('#text3'), 0, 500, 1000);
count($w('#text4'), 0, 1000, 1000);
});

function count(obj, start, end, duration) {
let startTimestamp = null;
const step = (timestamp) => {
if (!startTimestamp) startTimestamp = timestamp;
const progress = Math.min((timestamp - startTimestamp) / duration, 1);
obj.text = `${Math.floor(progress * (end - start) + start)}`;
if (progress < 1) {
requestAnimationFrame(step);
}
};
requestAnimationFrame(step);
}

演示:https://moshef9.wixsite.com/count-numbers

计数器函数取自:https://stackoverflow.com/a/60291224/863110

关于counter - 如何制作数字计数器来计算 Wix Velo 中的多个元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/71161359/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com