根据屏幕尺寸动态更新 aframe Videosphere答案

【问题标题】：Dynamically Update aframe Videosphere based on screen size根据屏幕尺寸动态更新 aframe Videosphere
【发布时间】：2018-12-05 19:42:56
【问题描述】：

我无法根据设备尺寸更新视频球内容。我目前正在执行以下代码。

查看开发工具中的代码，似乎所有内容都使用正确的 src 文件进行了更新，但 a-videosphere 似乎没有使用新的视频源进行更新或重新加载。

我曾尝试在一个帧中包含两个不同的视频资源，但它只会占用带宽并使加载速度变慢。

非常感谢任何帮助

<head> 
<script src="https://aframe.io/releases/0.7.0/aframe.min.js"></script>    
<script>src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

<!-- SCRIPT TO CHANGE VIDEO BASED ON SCREEN SIZE -->
<script>
$(function(){
if ($(window).width() < 769) {
$("#v1").attr("src", "img/Mobile.mp4");}
else if ($(window).width() > 768){
$("#v1").attr("src", "img/Full.mp4");}
});
</script>

</head>

<body>
<a-scene vr-mode-ui="enabled: false">

<a-assets>
    <video id="video" loop crossorigin="anonymous" playsinline>
         <source id="v1" src="" type="video/mp4">
    </video>
</a-assets>

 <a-videosphere id="videosphere" src="#video" rotation="0 -95 0"></a-videosphere>

 <a-entity id="camera" camera="fov: 75" look-controls></a-entity>

</a-scene>

</body>

【问题讨论】：

标签： jquery aframe

【解决方案1】：

资产用于预加载/缓存。任何更改都必须在实体中进行，而不是在资产中进行。

$("#videosphere").attr("src", "img/Mobile.mp4");}

【讨论】：

感谢安东尼，我实际上以这种方式完成了这项工作，但完全忘记了我发布了这个：感谢您回来回答:)
嗨，Calum，我一直在寻找解决这个问题的方法，但遇到了这个问题。找到解决方案后，我立即发布了答案。这是我关于堆栈溢出的第一个答案。您能否将其作为公认的答案，因为寻找解决方案的人可以确认该答案。谢谢。