Question

我正在尝试构建一个简单且可自定义的ES2015视差卷轴。

我的问题是关于构造包含低级HTML5指令的代码，例如requestAnimationFrame或setInterval（game_loop_method，1000/60）

很高兴：

HTML代码占用空间小，因此便于集成到网页的标题中（说博客或CMS）和lib内部的非侵入式jquerty：

<script>
  $(document).ready(function() {
    $.getJSON('parascroll/theme.json', function(theme) {
      var canvas = $('#ps').get(0);
      var ps = new ParaScroll({
        canvas: canvas,
        theme: theme,
        width: '100vw',
        height: '100vh'
      });
      ps.run();
    });
  });
</script>

和灵活的可自定义配置文件：

{
  "main": {
  "width": "100vw",
  "height": "100vh",
  "background": "#cfe"
},

"layers": [
  {
    "name": "floor-background",
    "sprites": 21,
    "velocity": "10",
    "top": "45%",
    "left": "0%",
    "width": "100%",
    "height": "25%",
    "background": "#afd",
    "spritesheet": "parascroll/spritesheet.png",
    "distro": [10, 20, 30, 10, 40] // statiscal distribution of sprites
  },

 // ... and so forth, for all layers

如何实现这样的结果？

（我不考虑使用一些lib作为PIXI，我的感觉是代码足够不使用10％的lib ...）

此致

ES2015视差卷轴程序结构？

0 个答案: