Multiple Instances

Each call to Dos constructor creates a new js-dos instance that works independently.

In the example below, you can see 4 DOS games on a single page:

<!doctype html>
<html>
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <meta charset="UTF-8">
    <style>
        html, body, #jsdos {
            width: 100%;
            height: 100%;
            margin: 0;
            padding: 0;
        }
        .container {
           display: flex;
           flex-wrap: wrap;
           flex-direction: row;
        }
        .player {
           width: 40vw;
           height: 25vw;
           background-color: black;
           margin: 2vw 4vw;
        }
    </style>
    <!-- js-dos style sheet -->
    <link rel="stylesheet" href="https://v8.js-dos.com/latest/js-dos.css">

    <!-- js-dos -->
    <script src="https://v8.js-dos.com/latest/js-dos.js"></script>
</head>
<body>
<div class="container">
    <div class="player"><div id="jsdos-1"></div></div>
    <div class="player"><div id="jsdos-2"></div></div>
    <div class="player"><div id="jsdos-3"></div></div>
    <div class="player"><div id="jsdos-4"></div></div>
</div>
<script>
    Dos(document.getElementById("jsdos-1"), {
        url: "https://v8.js-dos.com/bundles/digger.jsdos"
    });
    Dos(document.getElementById("jsdos-2"), {
        url: "https://v8.js-dos.com/bundles/ddave.jsdos"
    });
    Dos(document.getElementById("jsdos-3"), {
        url: "https://v8.js-dos.com/bundles/av.jsdos"
    });
    Dos(document.getElementById("jsdos-4"), {
        url: "https://v8.js-dos.com/bundles/perestroika.jsdos"
    });
</script>
</body>
</html>

13 октября 2024