Reprodutor de jogos em Flash com emulador Ruffle

10 iroger7

Abrir no Editor Video Publique Seu Código

Reprodutor de jogos em Flash com emulador Ruffle

Recomendado

28 July 2025

Balão de mensagem HTML com design SVG

2 April 2025

Um Código de Metehan

HTML

<Module>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta http-equiv="x-ua-compatible" content="ie=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
  <title>really cool flash game</title>
  <style>
    html, body {
      margin: 0;
      padding: 0;
      background: black;
      overflow: hidden;
      height: 100%;
      width: 100%;
    }
    #flash-container {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      background: black;
      overflow: hidden;
    }
    .black-box {
      position: fixed;
      background: black;
      z-index: 10;
    }
    #box-top {
      top: 0;
      left: 0;
      width: 100%;
      height: 0;
    }
    #box-bottom {
      bottom: 0;
      left: 0;
      width: 100%;
      height: 0;
    }
    #box-left {
      top: 0;
      left: 0;
      width: 0;
      height: 100%;
    }
    #box-right {
      top: 0;
      right: 0;
      width: 0;
      height: 100%;
    }
    ruffle-player {
      width: 100%;
      height: 100%;
      background: black;
      display: block;
    }
  </style>
  <script src="https://cdn.jsdelivr.net/npm/@ruffle-rs/ruffle@0.2.0-nightly.2025.10.2/ruffle.min.js"></script>
</head>
<body>
  <div id="flash-container"></div>
  <div class="black-box" id="box-top"></div>
  <div class="black-box" id="box-bottom"></div>
  <div class="black-box" id="box-left"></div>
  <div class="black-box" id="box-right"></div>
  <script>
    const container = document.getElementById("flash-container");
    const boxTop = document.getElementById("box-top");
    const boxBottom = document.getElementById("box-bottom");
    const boxLeft = document.getElementById("box-left");
    const boxRight = document.getElementById("box-right");
    
    function resizeGame() {
      const windowWidth = window.innerWidth;
      const windowHeight = window.innerHeight;
      const aspectRatio = 5.5 / 3;
      
      // Use 95% of available space instead of 100%
      let width = Math.floor(windowWidth * 1);
      let height = Math.floor(width / aspectRatio);
      
      if (height > windowHeight * 1) {
        height = Math.floor(windowHeight * 1);
        width = Math.floor(height * aspectRatio);
      }
      
      container.style.width = `${width}px`;
      container.style.height = `${height}px`;
      
      // Calculate margins
      const topMargin = (windowHeight - height) / 2;
      const leftMargin = (windowWidth - width) / 2;
      
      // Set black box sizes
      boxTop.style.height = `${topMargin}px`;
      boxBottom.style.height = `${topMargin}px`;
      boxLeft.style.width = `${leftMargin}px`;
      boxRight.style.width = `${leftMargin}px`;
    }
    
    window.addEventListener("resize", resizeGame);
    window.addEventListener("DOMContentLoaded", () => {
      resizeGame();
      const ruffle = window.RufflePlayer?.newest() || window.RufflePlayer?.createPlayer();
      if (ruffle && container) {
        const player = ruffle.createPlayer();
        player.style.width = "100%";
        player.style.height = "100%";
        player.style.background = "black";
        container.appendChild(player);
        player.load("$1");
      } else {
        container.textContent = "Ruffle failed to load."; 
      }
    });
  </script>
    <param name="movie" value="https://cdn.jsdelivr.net/gh/oldflashgames/games4@630f33f2ea89cfa120d42a0b3d0bf0b1f9edde8f/hobo-3-wante.swf">
    <embed src="https://cdn.jsdelivr.net/gh/oldflashgames/games4@630f33f2ea89cfa120d42a0b3d0bf0b1f9edde8f/hobo-3-wante.swf" width="100%" height="100%">
</body>
</html>
]]></Content>
</Module>

Reprodutor de jogos em Flash com emulador Ruffle

Recomendado

Balão de mensagem HTML com design SVG

Espátula de arrasto

Um Código de Metehan

HTML

CSS

JS

Recomendado

Balão de mensagem HTML com design SVG

Espátula de arrasto

Um Código de Metehan

HTMLCopy

CSSCopy

JSCopy

HTML

CSS

JS