Question

所以这里我有一个人的代码，他们在加入房间时将他们的预览/本地轨道添加到div onScreen。我可以很好地获得流，但每当我把它放入我的div时，它就不能正确地适应它的大小，以便它在屏幕的底角有一个较小的流。

div .css

#localMediaTrackDiv{
    width: 200px;
    height: 200px; 
    margin: auto;
    bottom: 0;
    right: 0;

    position: absolute;
    border: solid blue 1px;
}

react / html

componentWillMount(){
    // Request audio and video tracks
    createLocalVideoTrack({audio: false, video: { width: 250 } }).then(track => {
        var localMediaContainer = document.getElementById('localMediaTrack');
        localMediaContainer.appendChild(track.attach());
    });
}

<div id='localMediaTrackDiv'>
    <div id='localMediaTrack'/>
</div>

Answer 1

尝试在<video />元素上设置css宽度，如下所示：

#localMediaTrackDiv video{
    width: 200px;
    height: 200px; 
}

对我有用。

Answer 2

Twilio开发者传道者在这里。

当您致电createLocalVideoTrack时，您会通过width: 250选项，但您的CSS会将#localMediaTrackDiv的宽度设置为200px。尝试制作相同的数字。

如果有帮助，请告诉我。

Twilio视频轨道不适合div

2 个答案: