使用JavaScript制作带有一堆png文件的类似gif的动画?

时间:2015-08-09 02:12:57

标签: javascript animation png animated-gif

尽管我努力在一堆png文件中制作高质量的gif动画,但我仍然遇到错误......我已经得到了很多像“document.getElementById不是函数”和“未捕获的TypeError:无法设置null的属性'src”。我决定问这里我做错了什么。这是我在某处尝试使用的旧代码:

<script>

var min = 1;
var max = 12;
var current = min;

var keep_switching_icon = true;

function rotateIcon() {
  if (keep_switching_icon) {
    var nyanframe = document.getElementById('nyan')
    nyanframe.src = ({path:"nyan" + current + ".png"});
    console.log(current);
    if (current++ > max) {
      current = min;
    };

    window.setTimeout(rotateIcon, 300);
  }
}

rotateIcon();

</script>

<body>

<img src="nyan1.png" id="nyan"></img>

</body>

1 个答案:

答案 0 :(得分:1)

尝试用nyanframe.src = "nyan" + current + ".png";代替nyanframe.src = ({path:"nyan" + current + ".png"});

var min = 1;
var max = 12;
var current = min;

var keep_switching_icon = true;

function rotateIcon() {
  if (keep_switching_icon) {
    var nyanframe = document.getElementById('nyan');
    nyanframe.src = "nyan" + current + ".png";
    console.log(current);
    if (current++ > max) {
      current = min;
    };

    window.setTimeout(rotateIcon, 300);
  }
}

window.onload = rotateIcon;