Question

我正在使用网络摄像头的实时流来获取我个人网站的背景图片，我遇到问题，每2秒自动刷新一次。

Feed来源：

http://207.251.86.238/cctv290.jpg

我使用的是使用主题的Squarespace，我的CSS需要覆盖主题，所以我在这里注入了它：

#main {
background-image: url("http://207.251.86.238/cctv290.jpg");
background-size: cover;
}

我的JavaScript：

<script type="text/javascript">
    setTimeout(function() {
        document.getElementById("main").style.backgroundImage = "url("
            + "http://207.251.86.238/cctv290.jpg?"
            + new Date().getTime()
            + ")";
    }, 2000);
</script>

任何帮助非常感谢！谢谢！

Answer 1

你要做的是一个有趣的概念（虽然每两秒钟加载一个新图像是一种沉重的IMO）

您的主要问题是，当您应该使用setTimeout（多次/无限次迭代）时，您正在使用setInterval（一次迭代）

我还建议将元素引用保存到变量中，这样就不必每次迭代都可以获取它。它看起来像下面的

var main = document.getElementById("main");
setInterval(function() {
    // Fetch it again
    main.style.backgroundImage = "url(http://207.251.86.238/cctv290.jpg?"
    + new Date().getTime()
    + ")";
}, 2000);

Demo

直播背景图片不会刷新

1 个答案: