当网站上传到服务器时，Scrollmagic 停止工作？

如何解决当网站上传到服务器时，Scrollmagic 停止工作？

我创建了一个网站，当用户滚动浏览网站时，该网站使用 Scrollmagic 加载网站的某些部分（即，更改其不透明度并使其向上移动）。它在我计算机上的 HTML 文件上运行良好，但是由于某种原因，一旦我将它上传到我的托管服务器并进入实时站点，它就停止工作。网址是 https://liudzi.com/。有多个部分像这样加载，但我已经包含了一部分代码作为下面的示例：

<!--SCROLLMAGIC-->
<script src="http://cdnjs.cloudflare.com/ajax/libs/ScrollMagic/2.0.7/ScrollMagic.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/1.20.3/TweenMax.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/ScrollMagic/2.0.5/plugins/animation.gsap.min.js"></script>
<script>
    var controller = new ScrollMagic.Controller();

    var fadein_tween = TweenMax.fromTo('#content0',1,{
        yPercent: 10,opacity: 0,ease: Power1.easeInOut
    },{
        yPercent: 0,opacity: 1,ease: Power1.easeInOut
    });
</script>

解决方法

浏览器会阻止安全页面上的不安全请求。将来源更改为 https://。

这是在开发控制台中指出的：