网站直接调用哔哩哔哩自适应视频教程，兼容手机端

B 站官方视频分享代码，无法在手机端进行等比缩放的展示和播放。

站长决定写一个自适应 B 站视频调用的教程出来，分享给不会调用的小伙伴儿们。话不多说，下面上教程内容：

因为在 CSS 中无法实现等比高度，所以，我们可以借助 js 代码内容，我们可以给这个 iframe 标签加一个 id，然后再写一段对应的 js 代码，比如我们设定一个j2mmvideo的 id，则代码变为：

<iframe id="j2mmvideo" src="//player.bilibili.com/player.html?aid=969951173&page=1&high_quality=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true" width=100%> </iframe>

同时，我们还要在我们的主题 footer 中，加入以下代码

<script type="text/javascript"> 
if(document.getElementById("j2mmvideo")){
document.getElementById("j2mmvideo").style.height=document.getElementById("j2mmvideo").scrollWidth*0.64+"px";
}
</script>

这段代码的意思就是视频显示高度是宽度的 0.64 倍，经过站长调用调试发现，这个 0.64 是最佳的比例值！

调用效果如下：

到这里，我们网站调用的 B 站视频，就可以自适应了，不必担心手机端查看时因为设置了固定高度而不能正常显示了！