jquery - 循环浏览javascript中的图像

Question

我有一个插件可以围绕一组图像旋转 360 度（准确地说是 300 度）。我想知道是否可以使用 for in 循环或 for 循环来循环浏览所有图像。现在是这样设置的。

$("#spin").spritespin({
        width     : 510,
        height    : 327,
        frames    : 10,
        image     : [
                "360rotation/000.jpg",
                "360rotation/001.jpg",
                "360rotation/002.jpg",
                "360rotation/003.jpg",
                "360rotation/004.jpg",
                "360rotation/005.jpg",
                "360rotation/006.jpg",
                "360rotation/007.jpg",
                "360rotation/008.jpg",
                "360rotation/009.jpg",
                  ],

        animate   : true,
        loop      : true,
        frameTime : 60,
        fadeFrames : 20,
        fadeInTime : 0,
        fadeOutTime : 120
      });

这可行，但我不想输入所有 300 张图像。我怎样才能更快地做到这一点？

Answer 1

我想，最简单的方法是根据已知的开始和结束图像填充数组：

function namePad(num){
    if (num < 10){
        return '00' + num;
    }
    else if (num >=10 && num < 100){
        return '0' + num;
    }
    else {
        return num;
    }
}

var imageArray = [];

for (var i=0; i < 300; i++){
    imageArray.push('360rotation/' + namePad(i) + '.jpg');
}

JS Fiddle 概念证明。

Answer 2

也许像

var images = new Array();

for (i = 0; i < (n = 301); i++) {
  images.push("360rotation/00" + i + ".jpg")
}

$("#spin").spritespin({
    width     : 510,
    height    : 327,
    frames    : 10,
    image     : images,

    animate   : true,
    loop      : true,
    frameTime : 60,
    fadeFrames : 20,
    fadeInTime : 0,
    fadeOutTime : 120
  });