Html 为什么实时camra图像在图片框中重叠

我对html和所有web开发都是新手……而且我被卡住了

<div class="col-md-6">
    <div class="form-group">
        <label class="control-label col-md-3 col-sm-3 col-xs-6">Image</label>
        <div class="col-md-6">
            <div class="row">
                <div class="col-md-3" >
                    <div id="browseimage" class="form-group">
                        <img id='output'  src="images\user.png" height="150" width="150">    
                    </div>
                </div>
                <div class="col-md-3" >
                    <div id="liveimage" height="150" width="150" />
                </div>
            </div>                       
        </div> 
        <div class="row col-md-3">
            <input type='file' accept='image/*' title="" onchange='openFile(event)'>
            <button type="livecamrabtn" onClick="initialize_camra()">Live Camera</button>
            <button  value="Take Snapshot" onClick="take_snapshot()"/>      
        </div> 
    </div>
</div>
<script>
    var openFile = function(event) {
        var input = event.target;
        var reader = new FileReader();
        reader.onload = function(){
            var dataURL = reader.result;
            var output = document.getElementById('output');
            output.src = dataURL;
        };
        reader.readAsDataURL(input.files[0]);
    };
</script>

形象
现场摄像机
var openFile=函数（事件）{
var输入=event.target；
var reader=new FileReader（）；
reader.onload=函数（）{
var dataURL=reader.result；
var output=document.getElementById（'output'）；
output.src=dataURL；
};
reader.readAsDataURL（input.files[0]）；
};

我想同时显示这两张图片……但我不知道问题出在哪里？ 请建议

---

您需要在同一分区内定义图像和视频分区，并将视频分区指定为绝对位置和z索引

<div id="browseimage" class="form-group"  style="width:150px;height:150px" >
    <img id='output'  src="images\user.png" height="150" width="150">
    <div id="liveimage" height="150" width="150" style="postition:absolute;z-index:999"/>
    </div>    
</div>

---

您需要在同一分区内定义图像和视频分区，并将视频分区指定为绝对位置和z索引

<div id="browseimage" class="form-group"  style="width:150px;height:150px" >
    <img id='output'  src="images\user.png" height="150" width="150">
    <div id="liveimage" height="150" width="150" style="postition:absolute;z-index:999"/>
    </div>    
</div>

很抱歉，这次没有添加图像。很抱歉，这次没有添加图像。