Code d'intégration HTML5 du jeu Geometry Dash Lite

445 poooky

Ouvrir dans l'éditeur Publiez votre code

Code d'intégration HTML5 du jeu Geometry Dash Lite

Recommandé

30 March 2025

Un code par ytr3d3

1 April 2026

GN-Math : Jeux débloqués, recherche, tri et zones de jeu

15 April 2026

Éditeur HTML : Aperçu en direct et saisie de code

HTML

<!DOCTYPE html>

<head>
  <base href="https://cdn.jsdelivr.net/gh/bubbls/UGS-Assets@main/gdlite/">
    <title>Geometry Dash</title>
    <link rel="icon" type="image/png" href="https://e3334afd.cf-nate.pages.dev/0/g/geodash/game/splash.png">
    <meta name="description" content="Play Geometry Dash Lite Online For Free on Chromebook, PC, Windows, Desktop in Chrome and modern browsers.">
    <link rel="canonical" href="https://gamecomets.com/game/geometry-dash-lite/" />
    <meta name="robots" content="noindex, nofollow">
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="themes/geometrydashlite.io/rs/css/home.css?v=1">
</head>
<meta name="cf-2fa-verify" content="GpoihhhSRQknehLQkEtXM">

<body>
    <style>
        html {
            box-sizing: border-box;
        }
        
        *,
        *:before,
        *:after {
            box-sizing: inherit;
        }
        
        body {
            margin: 0;
            background-image: linear-gradient(rgb(0, 0, 0), rgb(0, 102, 255));
            overflow: hidden;
        }
        
        #gameContainer {
            width: 100vw;
            height: 100vh;
        }
        
        canvas {
            width: 100%;
            height: 100%;
            display: block;
        }
        
        canvas+* {
            z-index: 2;
        }
        
        .container {
            max-width: 1600px;
            position: relative;
        }
        
        .posImg {
            position: absolute;
            top: 0;
            width: 100%;
            height: 100%;
        }
        
        .logo {
            position: absolute;
            display: block;
            max-width: 100vw;
            max-height: 70vh;
            top: 300px;
        }
        
        .pos_progress {
            position: absolute;
            bottom: 15%;
            width: 100%;
        }
        
        .progress {
            margin: 1.5em auto;
            max-width: 436px;
            height: auto;
            display: none;
            position: relative;
        }
        
        .full {
            width: 97%;
            transform-origin: top left;
        }
        
        .box_process {
            width: 100%;
        }
        
        .process {
            width: 98%;
        }
        
        .progress .posfull,
        .progress .posbox {
            position: absolute;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        
        .progress .posfull {
            top: 8px;
            z-index: 1;
        }
        
        .progress .posbox {
            top: 0;
            z-index: 2;
        }
        
        #loader {
            position: absolute;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            background-image: linear-gradient(rgb(0, 0, 0), rgb(0, 102, 255));
        }
        
        .pos_spinner {
            position: absolute;
            top: 70%;
            left: 50%;
            transform: translate(-30%, -50%);
        }
        
        .spinner,
        .spinner:after {
            display: none;
            border-radius: 50%;
            width: 5em;
            height: 5em;
        }
        
        .spinner {
            margin: 10px;
            font-size: 10px;
            position: relative;
            text-indent: -9999em;
            border-top: 1.1em solid rgba(255, 255, 255, 0.2);
            border-right: 1.1em solid rgba(255, 255, 255, 0.2);
            border-bottom: 1.1em solid rgba(255, 255, 255, 0.2);
            border-left: 1.1em solid #ffffff;
            transform: translateZ(0);
            animation: spinner-spin 1.1s infinite linear;
        }
        
        @keyframes spinner-spin {
            0% {
                transform: rotate(0deg);
            }
            100% {
                transform: rotate(360deg);
            }
        }
    </style>
    <div id="gameContainer"></div>
    <div id="loader"><img class="logo" src="image/loading.png?v=1">
        <div class="spinner"></div>
        <div class=" pos_progress">
            <div class="progress">
                <div class="posfull"><img class="full" src="image/process_bar_back.png"></div>
                <div class="posbox"><img class="box_process" src="image/process_bar_front.png"></div>
            </div>
        </div>
        <script>
      window.fileMergerConfig = {
        files: [
          { name: 'GeometryDashLite.data.unityweb', parts: 2 },
          { name: 'GeometryDashLite.wasm.code.unityweb', parts: 1 },
          { name: 'GeometryDashLite.wasm.framework.unityweb', parts: 1 },
        ],
        basePath: 'Build/',
        debug: true
      };  
      </script>
    <script src="https://cdn.jsdelivr.net/gh/bubbls/UGS-Assets@ac5cdfc0042aca584e72619375b4aca948a9243c/merge.js"></script>
        <script src="Build/UnityLoader.js"></script>
        <script>
            var gameInstance = UnityLoader.instantiate("gameContainer", "Build/GeometryDashLite.json", {
                onProgress: UnityProgress
            });

function ShowInfo() {
                $("div.main-panel").css('width', $("div.main-panel").css('max-width'));
                $("div.main-panel-ads").css('display', 'block');
                $("div.main-panel-content").css('display', 'block');
                $('button.hide-main-panel').children('i').html('>>');
            }

function HideInfo() {
                $("div.main-panel").css('width', '0px');
                $("div.main-panel-ads").css('display', 'none');
                $("div.main-panel-content").css('display', 'none');
                $('button.hide-main-panel').children('i').html('Info');
            }
            $('button.hide-main-panel').click(function() {
                console.log('a');
                ToggleInfo();
            });
        </script>
</body>

</html>

CSS