如何将相机视图限制为DIV元素边界

时间:2018-12-03 02:51:36

标签: javascript html5 three.js ar.js

我试图在此AR网站上允许一些空间添加导航菜单,但无法覆盖AR.JS默认的全屏摄像头视图。我的代码几乎就像Jerome的原始代码一样:

<body style='margin : 0px; overflow: hidden; font-family: Monospace; padding: 20px;'>

    <div id="camera"></div>
<scrpit>
.
.
document.getElementById('camera').appendChild( renderer.domElement );
.
.
</script>
</body>

请注意,我在body标签上添加了20px的填充,但是末尾添加的video标签完全忽略了填充。

1 个答案:

答案 0 :(得分:0)

稍后添加video元素时,您可以在定义其确切添加内容和添加方式的代码中查找,也可以尝试覆盖它。应该可以在左侧获得20px的空白:

video {
    margin-left: 20px !important;
}

但是请确保实际视频和AR.js场景没有受到负面影响。