为什么在Firefox中通过JavaScript将后台恢复为透明会失败？

我的页面顶部有一个导航菜单和徽标。最初，背景色是透明的。在滚动时，它将变为60%不透明黑色。如果用户滚动回顶部，菜单的背景应恢复为100%透明度

我在Chrome、IE、Opera（工作）和Firefox（不工作）中测试了它。我试过了

style.backgroundColor='rgba（0,0,0,0）'

和

.style.backgroundColor='透明'

JS:

以及相关的HTML：

        <header id="page_header">
          <a href="index.html" class="callout">Placeholder Logo Text</a>
        </header>
        <!-- main navigation -->
        <nav id="main-nav">
          <ul>
            <li><a href="#">link</a></li>
            <li><a href="#">link</a></li>
            <li><a href="#">link</a></li>
          </ul>
        </nav>
      </div>








我猜问题与Firefox的默认背景色为白色有关（对吗？）。但如果我的函数将其设置为透明，为什么它不工作

编辑：当我在本地服务器上测试页面时，它在Firefox中工作。当我在没有运行服务器的情况下测试其他JavaScript函数时，我制作的其他JavaScript函数在Firefox中运行良好。不过，我只是从这个开始。谁能告诉我Firefox的这个功能有什么不同吗？
什么是
主菜单
？
不起作用
发生了什么？你期待什么呢？我认为浏览器和你展示的代码完全没有区别哦，对不起！在Firefox中不起作用的是，当我向后滚动时，不透明度不会变回透明。它保持60%的黑色<代码>主菜单

是我发布的HTML代码包装的div。@Cinder你调试代码了吗？它的哪些部分在Firefox中运行？我发现，当我在本地服务器上测试页面时，所有内容都在Firefox中正常运行：菜单最初是透明的，向下滚动和向上滚动时，背景为60%黑色，背景恢复为透明。但是当我在浏览器中测试页面时（本地服务器未运行），它在向上滚动时不会返回其透明状态。

主菜单是什么？
不工作
发生了什么？你期待什么呢？我认为浏览器和你展示的代码完全没有区别哦，对不起！在Firefox中不起作用的是，当我向后滚动时，不透明度不会变回透明。它保持60%的黑色<代码>主菜单

是我发布的HTML代码包装的div。@Cinder你调试代码了吗？它的哪些部分在Firefox中运行？我发现，当我在本地服务器上测试页面时，所有内容都在Firefox中正常运行：菜单最初是透明的，向下滚动和向上滚动时，背景为60%黑色，背景恢复为透明。但是，当我在浏览器中测试页面时（本地服务器未运行），它在向上滚动时不会返回其透明状态。

        <header id="page_header">
          <a href="index.html" class="callout">Placeholder Logo Text</a>
        </header>
        <!-- main navigation -->
        <nav id="main-nav">
          <ul>
            <li><a href="#">link</a></li>
            <li><a href="#">link</a></li>
            <li><a href="#">link</a></li>
          </ul>
        </nav>
      </div>