test casque vr en mobile

public/css/utils.css

@@ -1483,8 +1483,7 @@ @media (max-width: 768px) {
 
     .vr-container{
             height: 57vh;
-                margin-top: -23rem;
-                z-index: -1;
+           
     }
 
     .line-icube{

public/js/three.js

@@ -20,25 +20,30 @@ let isMobile = window.innerWidth <= 768; // On considère que l'écran est mobil
 
 if (isMobile) {
     console.log("Mobile");
-    renderer.setSize(window.innerWidth, window.innerHeight); // Pleine taille pour mobile
+    renderer.setSize(window.innerWidth, window.innerHeight / 3 ); // Pleine taille pour mobile
 } else {
     console.log("Desktop");
     renderer.setSize(window.innerWidth / 2, window.innerHeight / 2); // Divisé par 2 pour les écrans plus grands
 }
 
-renderer.setClearColor(0xffffff, 1); // Fond blanc
+renderer.setClearColor(0x0000ff, 1);
+
 
 // Pour réagir aux changements de taille d'écran, ajoutez un écouteur 
 window.addEventListener("resize", () => {
     isMobile = window.innerWidth <= 768;
 
     if (isMobile) {
-        renderer.setSize(window.innerWidth, window.innerHeight);
+        renderer.setSize(window.innerWidth, window.innerHeight / 3);
     } else {
         renderer.setSize(window.innerWidth / 2, window.innerHeight / 2);
     }
+
+    camera.aspect = window.innerWidth / (isMobile ? window.innerHeight / 3 : window.innerHeight / 2);
+    camera.updateProjectionMatrix();
 });
 
+
 // Ajouter le renderer au DOM
 const container = document.getElementById("three-container");
 container.appendChild(renderer.domElement);

resources/views/pages/accueil.blade.php

@@ -157,7 +157,7 @@ class="img-fluid object-fit-cover h-img-spons">
 
 
 
-    <div class="d-flex flex-column flex-md-row position-relative blockandnone">
+    <div class="d-flex flex-column flex-md-row position-relative ">
         <div id="three-container" class="vr-container"></div>
         <!-- <div class="position-absolute overlay-vr">
             <img src="{{ asset('images/mainVr.png') }}" alt="image illustration" class="img-fluid object-fit-cover overlay-vr-img">