Spaces:
No application file
No application file
<html lang="en"> | |
<head> | |
<meta charset="UTF-8"> | |
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
<title>3D Model Viewer</title> | |
<script type="module" src="/script-3d.js"></script> | |
<style> | |
body, html { | |
margin: 0; | |
padding: 0; | |
width: 100%; | |
height: 100%; | |
background-color: black; | |
overflow: hidden; | |
} | |
model-viewer { | |
width: 100%; | |
height: 100%; | |
} | |
</style> | |
</head> | |
<body> | |
<model-viewer src="3D-models/iss.glb" alt="A 3D model" auto-rotate camera-controls></model-viewer> | |
</body> | |
<script> | |
document.addEventListener('keydown', (event) => { | |
if (['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'].includes(event.key)) { | |
event.preventDefault(); | |
window.parent.postMessage({ key: event.key }, '*'); | |
} | |
}); | |
</script> | |
</html> |