Fullscreen your web when loaded in iframe

I had a mini classic game Brick Breaking Game clone in Javascript back in old days.

It is not displayed in fullscreen. Fair enough. But then I wanted to make it look fullscreen when it is framed in other web page.

Below is the script I needed:

window.onload = function() {
  if (window.top != window.self) {
    var container = document.getElementById("container");
    container.classList.add("fullscreen");
  }
}

And the css:

#container.fullscreen {
  width: 100%;
  height: 100%;
}

When you iframe it in your other web project like below, it displays in fullscreen.

<iframe src="http://brick-breaking-game.herokuapp.com"></iframe>

iframe Brick Breaking Game

Unfortunately the hover effect makes game control impossible...