B站视频嵌入博客文章的自适应代码

在编辑博客时,需要嵌入B站视频,但复制B站给的嵌入代码后会发现宽度和高度属性都没有,无法自适应div,单独设置宽度和高度也不太完美,如何解决这个问题?

用下面这段代码,只需要替换aid即可:

<iframe id=\"spkj\" src=\"https://player.bilibili.com/player.html?aid=900831672&bvid=BV1VN4y1K76x&cid=839712989&page=1\" scrolling=\"no\" border=\"0\" frameborder=\"no\" framespacing=\"0\" allowfullscreen=\"true\" width=100% sandbox=\"allow-top-navigation allow-same-origin allow-forms allow-scripts\"> </iframe>
<script type=\"text/javascript\">  
document.getElementById(\"spkj\").style.height=document.getElementById(\"spkj\").scrollWidth*0.76+\"px\";
</script>

这段代码可以使嵌入文章的B站视频自适应div的宽度,效果如下:

document.getElementById(\"spkj\").style.height=document.getElementById(\"spkj\").scrollWidth*0.76+\"px\";

其中的代码:

sandbox=\"allow-top-navigation allow-same-origin allow-forms allow-scripts\"

可以使点击的弹出链接失效,避免外链跳出本站,如果不需要这个效果,删掉这段代码即可。

收藏本站,已备不时之需吧。

上一篇 电脑显示文件夹显示正在使用无法删除/重命名
下一篇 微软见了都得点赞!Windows 桌面的最高级玩法!

探索站点内容

搜索文章、标签、分类

关注公众号
领美团外卖神券
领美团外卖神券
最新评论
小高网
小高网
11月2日
多用户版在线预览:https://lik.kdns.fr/qqspace/index.php?uid=4
dadaowokou
dadaowokou
10月22日
求更新的
日月先生
日月先生
10月8日
留个言看看
小高网
小高网
10月4日
有更新本帖会重新置顶
7777
7777
10月4日
麻烦置顶
7777
7777
10月3日
那些看剧的app好像没了
hghghg
hghghg
9月24日
强制更新升级,用不了
小高网

小高网管理员

小高网www.xx8g.com

本月创作热力图

少
多