我在另一个主题上发现:
$({
countNum: $('.skill-counter').text()
}).animate({
countNum: 90
}, {
duration: 2000,
easing: 'linear',
step: function () {
$('.skill-counter').text(Math.floor(this.countNum) + 1 + ('%'));
}
});
我试图改变的是将其放入一个函数中,并在具有不同计数值的多个框中使用。
到目前为止我所做的:
var count = function (counTo, divName) {
this.counTo = 0;
$(counTo).animate({
counTo: counTo
}, {
duration: 2000,
easing: 'linear',
step: function () {
$(divName).text(Math.floor(counTo) + 1 + ('%'));
}
});
};
count(90, 'box1');
count(70, 'box2');
count(50, 'box3');
它不起作用,可能这很正常,因为它完全错了!那么我该怎么做呢?
var count = function (countTo, divName) {
//Set the starting object as {countTo:0}
$({countTo: 0}).animate({countTo: countTo}, {
duration: 2000,
easing: 'linear',
step: function () {
//get the reference to the value using 'this'
$(divName).text(Math.floor(this.countTo) + 1 + ('%'));
}
});
};
//Pass resolvable selectors
count(90, '#box1');
count(70, '#box2');
count(50, '#box3');
演示小提琴