亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

為什么 video.width 是 0 但實際上是 539?

為什么 video.width 是 0 但實際上是 539?

嚕嚕噠 2021-12-23 16:59:42
這是一張圖片并且寬度和高度不是 0,但是當我在控制臺中打印它時,它返回 0。、這是我如何打印它的代碼:const video = document.getElementById("remoteVideo");video.addEventListener('play', () => {      setInterval(async () => {      console.log(video.width);      console.log(video.height);      }, 100)    });這是完整的html:<!DOCTYPE html><html></html><head>  <meta charset="UTF-8">  <title>Document</title>  <style type="text/css">      html { height: 100%; }      body { height: 100%; margin: 0; background: #111; text-align: center; }      #remoteVideo { height: 70%; margin-top: 5%; background: #000; }      #localVideo { width: 20%; position: absolute; right: 1.1em; bottom: 1em; border: 1px solid #333; background: #000; }      #callButton { position: absolute; display: none; left: 50%; font-size: 2em; bottom: 5%; border-radius: 1em; }  </style>  <script defer src="static/face-api.min.js"></script></head><body>    <video id="localVideo" autoplay muted></video>    <video id="remoteVideo" autoplay></video>    <button id="callButton" onclick="createOffer()">?</button>    <script src="/socket.io/socket.io.js"></script>    <script defer src="static/script.js"></script></body></html>我究竟做錯了什么?
查看完整描述

1 回答

?
慕容3067478

TA貢獻1773條經驗 獲得超3個贊

您可以使用


沒有異步的getBoundingClientRect


這是您如何使用https://www.pexels.com/videos/在最小的、可重現的示例中發布您的問題


const video = document.getElementById("remoteVideo");

video.addEventListener('play', () => {

    console.log(video.getBoundingClientRect() );

});

html {

  height: 100%;

}


body {

  height: 100%;

  margin: 0;

  background: yellow;

  text-align: center;

}


#remoteVideo {

  height: 70%;

  margin-top: 5%;

  background: red;

}


#localVideo {

  width: 20%;

  position: absolute;

  right: 1.1em;

  bottom: 1em;

  border: 1px solid #333;

  background: pink;

}


#callButton {

  position: absolute;

  display: none;

  left: 50%;

  font-size: 2em;

  bottom: 5%;

  border-radius: 1em;

}

<video id="localVideo" src="https://player.vimeo.com/external/357005099.sd.mp4?s=a95b2118e2fa52097ad9933b56d50ebcc9f2f1c9&profile_id=139&oauth2_token_id=57447761" autoplay muted>Video</video>

<video id="remoteVideo" autoplay src="https://player.vimeo.com/external/340284081.sd.mp4?s=00350f6e127d8ac3777d74528fa439944f7d9f2c&profile_id=139&oauth2_token_id=57447761">Video</video>

<button id="callButton" onclick="createOffer()">Button ?</button>


查看完整回答
反對 回復 2021-12-23
  • 1 回答
  • 0 關注
  • 247 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號