第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問題,去搜搜看,總會(huì)有你想問的

可調(diào)整大小的視頻不完全適合父 div

可調(diào)整大小的視頻不完全適合父 div

茅侃侃 2023-07-20 10:37:47
我有一個(gè)可拖動(dòng)且可調(diào)整大小的視頻元素。我希望視頻元素在調(diào)整大小時(shí)能夠 100% 適合父 div,但這是我未能做到的地方。這是我到目前為止所擁有的:CSS.my-div{? ? width: 320px;? ? height: 240px;? ? top: 200px;? ? left: 400px;? ? position:absolute;? ? z-index: 9;? ? background-color: #28a745;}??JSlet video_div =? document.createElement('div');video_div.id = 'video-div'$(video_div).addClass('my-div')$("body").append(($(video_div).draggable().resizable()))let video_element;video_element = document.createElement('video');$(video_element).attr('id', 'my_video');$(video_element).attr('class', 'video-js vjs-default-skin');$(video_element).attr('width', '100%');$(video_element).attr('height', '100%');$(video_element).attr('controls', ' ');$(video_element).attr('preload', 'auto');$(video_element).attr('data-setup', '{}');let source = document.createElement('source');$(source).attr('type', "video/mp4");$(source).attr('src', "http://grochtdreis.de/fuer-jsfiddle/video/sintel_trailer-480.mp4");$(video_div).append(video_element)$(video_element).append(source);如果您嘗試調(diào)整視頻大小,它不適合父 div(綠色背景出現(xiàn)在后面)我該如何修改我的代碼來實(shí)現(xiàn)這一目標(biāo)?
查看完整描述

1 回答

?
慕斯709654

TA貢獻(xiàn)1840條經(jīng)驗(yàn) 獲得超5個(gè)贊

默認(rèn)情況下,視頻標(biāo)簽嘗試保持視頻寬高比。如果你想填充你的parent,你必須使用CSS屬性“object-fit”

在您的代碼中,嘗試添加

video_element.style.objectFit?=?"fill";

或者,使用 JQuery:

$(video_element).css("object-fit",?"fill");

當(dāng)然,這樣做并不能保證視頻的完美寬高比。

查看完整回答
反對(duì) 回復(fù) 2023-07-20
?
慕的地6264312

TA貢獻(xiàn)1817條經(jīng)驗(yàn) 獲得超6個(gè)贊

將 % 添加到周圍名為 .my-div 的 div 的高度(在該視頻中它是 56.25%)。如果更改寬度,高度始終為高度的 56.25%,并且視頻應(yīng)該適合。

查看完整回答
反對(duì) 回復(fù) 2023-07-20
  • 1 回答
  • 0 關(guān)注
  • 156 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購(gòu)課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)