我正在構建一個函數來定期更新HTML節點的背景位置。該函數適用於單個節點,但在多節點上調用時(在以下示例中),只有最後一個節點受此函數影響。無法啓動多個setInterval
根據函數內的警報(索引),爲每個節點調用setInverval()。我想不出爲什麼它不生效。
var bgImgAnimate = function (settings) {
$.each(settings.nodeList, function (index, node) {
thisNode = $(node);
var thisPosition;
setInterval(function() {
alert(index);
//calculate the position before position the image
thisPosition = - settings.frameWidth * settings.currentFrame;
thisNode.css('backgroundPosition', (thisPosition + 'px') + ' ' + (settings.verticalPos + 'px'));
}, settings.interval);
});
};
var settings = {
nodeList: $('#star1, #star2, #star3'),
verticalPos: 0,
currentFrame: 1,
frameWidth: 26,
startTime: 2,
frameNumber: 10,
interval: 200
}
bgImgAnimate(settings);