Skip to content
Snippets Groups Projects
index.html 2.01 KiB
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>TP 1</title>
        <link rel="icon" type="image/x-icon" href="/images/favicon.ico">
        <link rel="stylesheet" href="app.css">
        <style>
            body { margin: 0; }
            canvas { width: 100%; height: 100% }
            .centre{text-align: center;}
        </style>
    </head>
    <body>
        <header>
            <h3 class="logo">OurProject</h3>
            <h3 class="creators">Merimi & Mehiaoui</h3>
            <h1 class="title">THREE.JS Project</h1>
            <p class="subtitle">Découvrez notre petit projet en three.js !</p>
        </header>
        <!-- API importe du site de Three.js -->
        <script async src="https://unpkg.com/es-module-shims@1.3.6/dist/es-module-shims.js"></script>
        <script type="importmap">
            {
                "imports": {
                    "three": "https://threejs.org/build/three.module.js",
                    "three/addons/": "https://threejs.org/examples/jsm/"
                }
            }
        </script>
        
        <main>
            <div id="webGL" class="centre">
                <p class="accroche">Juste un bol, des fruits, et des fleurs</p>
                <p class="explications">Ceci est un projet, censé representer la scene originale présentée en photo en premier plan. Des modifications<br>ont été apportées tant bien
                que mal. Ayant commencé le design des pommes avec blender, nous avons eu beaucoup de mal à les exporter en three.js. Mais nous avons fait de notre mieux et ésperont que vous apprecirez ce modeste design
                </p>
                <div class="projetAndOriginal">
                    <div class="scene">
                        <script type="module" src="projet.js"></script>
                    </div>
                    <div class="original">
                        <img src="img.jpg" alt="Image originale">
                    </div>
                </div>
            </div>
        </main>
    </body>
</html>