问图片记忆游戏
EN

Stack Overflow用户

提问于 2017-06-24 17:04:52

回答 1查看 329关注 0票数 0

这是一个字母记忆游戏。我想通过图片来制作这个游戏，但我不能生成图像并将它们写在数组中。

<script>
  var memory_array = ['A', 'A', 'B', 'B', 'C', 'C', 'D', 'D', 'E', 'E', 'F', 'F', 'G', 'G', 'H', 'H', 'I', 'I', 'J', 'J', 'K', 'K', 'L', 'L'];
  var memory_values = [];
  var memory_tile_ids = [];
  var tiles_flipped = 0;
  Array.prototype.memory_tile_shuffle = function() {
    var i = this.length,
      j, temp;
    while (--i > 0) {
      j = Math.floor(Math.random() * (i + 1));
      temp = this[j];
      this[j] = this[i];
      this[i] = temp;

    }
  }

  function newBoard() {
    tiles_flipped = 0;
    var output = '';
    memory_array.memory_tile_shuffle();
    for (var i = 0; i < memory_array.length; i++) {
      output += '<div id="tile_' + i + '" onclick="memoryFlipTile(this,\'' + memory_array[i] + '\')"></div>';
    }
    document.getElementById('memory_board').innerHTML = output;
  }
</script>
</head>

<body>
  <div id="memory_board"></div>
  <script>
    newBoard();
  </script>

javascript

html

css

回答 1

Stack Overflow用户

发布于 2017-06-24 17:27:30

您可以添加style标签，如下例所示。

output += "<div id='tile_"+i+"' style=\"background-image:url('images/" + i + ".png');background-size:100% 100%; background-repeat:no-repeat;></div>";

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/44734750

复制

相似问题

问图片记忆游戏
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问图片记忆游戏EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问图片记忆游戏
EN