Почему в Firefox не удается вернуть фон в прозрачный с помощью JavaScript? - PullRequest
Новая
       36

Почему в Firefox не удается вернуть фон в прозрачный с помощью JavaScript?

1 голос
/ 20 апреля 2019

У меня есть меню навигации и логотип в верхней части моей страницы.Изначально цвет фона прозрачный.При прокрутке он меняется на 60% непрозрачный черный.Если пользователь прокручивает страницу вверх, фон меню должен вернуться к 100% прозрачности.

Я тестировал его в Chrome, IE, Opera (работает) и Firefox (не работает).Я пытался
style.backgroundColor = 'rgba(0,0,0,0)'; и .style.backgroundColor = 'transparent';

JS: 


function scrollFunction() {
  if (document.body.scrollTop > 80 || document.documentElement.scrollTop > 80) {
    document.getElementById("main_menu").style.backgroundColor = 'rgba(0,0,0,0.6)';
    document.querySelector(".callout").style.fontSize = "2.4rem";
  } else {
    document.getElementById("main_menu").style.backgroundColor = 'rgba(0,0,0,0)';
    document.querySelector(".callout").style.fontSize = "3rem";
  }
}

И соответствующий 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, которые я сделал, прекрасно работали в Firefox, когда я тестировал их без запуска сервера.Я только начинаю с этого, хотя.Может кто-нибудь сказать мне, что отличает эту функцию для Firefox?

...