Neigung

Im Editor öffnen Video Veröffentlichen Sie Ihren Code

9 July 2025

Preiskarte mit 3D-Neigungs- und Energieringeffekt

HTML

<!DOCTYPE html>
<html lang="en-us">

<head>
    <base href="https://cdn.jsdelivr.net/gh/gn-math/assets@51462750d29b68ac1e33887c1bf13d9c478d5ead/198/">
    <meta charset="utf-8">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Unity WebGL Player | Slope Plus</title>
    <link rel="shortcut icon" href="TemplateData/favicon.ico">
    <link rel="stylesheet" href="TemplateData/style.css">
    <style>
        html,
        body {
            margin: 0;
            padding: 0;
            overflow: hidden;
            height: 100%;
            width: 100%;
        }

#unity-container {
            width: 100%;
            height: 100%;
            position: absolute;
            top: 0;
            left: 0;
        }
    </style>
    <script src="TemplateData/UnityProgress.js"></script>
    <script src="Build/UnityLoader.js"></script>
    <script>
        function mergeFiles(fileParts) {
            return new Promise((resolve, reject) => {
                let buffers = [];

function getParts(file, start, end) {
            let parts = [];
            for (let i = start; i <= end; i++) {
                parts.push(file + ".part" + i);
            }
            return parts;
        }

window.addEventListener('resize', resizeGameContainer);

window.onload = function () {
            resizeGameContainer();

Promise.all([
                mergeFiles(getParts("https://cdn.jsdelivr.net/gh/gn-math/assets@51462750d29b68ac1e33887c1bf13d9c478d5ead/198/Build/WEB1.2.1.data.unityweb", 1, 2))
            ]).then(([dataUrl]) => {
                let json = {
                    companyName: "Slope Plus",
                    productName: "Slope Plus",
                    dataUrl: dataUrl,
                    wasmCodeUrl: "https://cdn.jsdelivr.net/gh/gn-math/assets@51462750d29b68ac1e33887c1bf13d9c478d5ead/198/Build/WEB1.2.1.wasm.code.unityweb",
                    wasmFrameworkUrl: "https://cdn.jsdelivr.net/gh/gn-math/assets@51462750d29b68ac1e33887c1bf13d9c478d5ead/198/Build/WEB1.2.1.wasm.framework.unityweb",
                    TOTAL_MEMORY: 268435456,
                    graphicsAPI: ["WebGL 2.0", "WebGL 1.0"],
                    webglContextAttributes: {
                        preserveDrawingBuffer: false
                    },
                    splashScreenStyle: "Dark",
                    backgroundColor: "#000000"
                }
                let blob = new Blob([JSON.stringify(json)], {
                    type: 'application/json'
                });
                let blobUrl = URL.createObjectURL(blob);
                UnityLoader.instantiate("gameContainer", json, {
                    onProgress: UnityProgress,
                    url: blobUrl
                });
            });
        };
    </script>
</head>

</html>

Preiskarte mit 3D-Neigungs- und Energieringeffekt

HTMLCopy

CSSCopy

JSCopy

HTML

CSS

JS