我正在wordpress网站上工作,想在目标编号上添加显示动画编号的标签。
这是一个示例(此页面右上方)https://servicestack.net/
我发现了一些基于jQuery的动画师。如果您可以指出更多此类动画师,则选择最佳动画师将很有帮助。对于我的动画,目标编号是静态的(它不是来自任何数据库或数据源)。我应该能够说出目标100并从94开始,以便数字可以从94变为100。
这是我发现的
http://fredhq.com/projects/roundabout/demos/counter
最佳答案
我用两个额外的属性制作了一个元素,如下所示:
<div class="number" target="100" start="94"></div>
它应该包含您要显示的数字。
我也添加了以下jQuery代码:
$(function() {
var element = $(".number").first();
element.text(element.attr("start"));
setTimeout(function(){
step(element);
}, randTime());
});
function step(element) {
element.text(+element.text() + 1);
if (element.text() != element.attr("target")) {
setTimeout(function(){
step(element);
}, randTime());
}
};
function randTime() {
return Math.round(Math.random() * 400);
};
这应该是不言而喻的。
另请参见this jsFiddle。
关于javascript - 数字动画师-WordPress的,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/23344231/