Code Canvas HTML WebGL de Super Mario 64

1,436 GΛMΞ STΔSH

Ouvrir dans l'éditeur Publiez votre code

Code Canvas HTML WebGL de Super Mario 64

Recommandé

25 November 2025

Modèle HTML pour site web de films | Responsive et filtrable

31 October 2025

Portfolio de développeur : Services de conception et de développement web

20 February 2026

Modèle HTML de portfolio de développeur avec arrière-plan animé

HTML

<html lang="en-us"><head>
    <meta charset="utf-8">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Super Mario 64</title>
    <style>
      body, html{
        margin: 0;
        padding: 0;
        width: 100vw;
        min-height: 100vh;
        font-family: Arial, Helvetica, sans-serif;
        color: white;
        image-rendering: pixelated;
        scrollbar-width: none;
      }
      ::-webkit-scrollbar {
        display: none;
      }
      #container {
        width: 100vw;
        height: 100vh;
        display: flex;
        align-items: center;
        justify-content: center;
      }
      canvas {
        width: 100vw;
        height: 100vh;
      }
    </style>
  </head>
  <body>
    <div id="container">
      <canvas class="emscripten" id="canvas" width="1920" height="1080" style="cursor: default;"></canvas>
    </div>
    <script type="text/javascript">
      var Module = {
        preRun: [],
        postRun: [],
        print: (function() {
          return function(text) {
            if (arguments.length > 1) text = Array.prototype.slice.call(arguments).join(' ');
            console.log(text);
          };
        })(),
        printErr: function(text) {
          if (arguments.length > 1)
            text = Array.prototype.slice.call(arguments).join(' ');
          console.error(text);
        },
        canvas: (function() {
          var canvas = document.getElementById('canvas');
          canvas.width = window.innerWidth; // Todo: how to do this from c++
          canvas.height = window.innerHeight;
          canvas.addEventListener("webglcontextlost", function(e) {
            alert('WebGL context lost. You will need to reload the page.');
            e.preventDefault();
          }, false);
          return canvas;
        })(),
        setStatus: function(text) {
        }
      };
    </script>
    <script async="" type="text/javascript" src="https://cdn.jsdelivr.net/gh/ArkShocer/sm64@main/sm64.us.f3dex2e.js"></script>
    <script>
    </script>

</body></html>

CSS