Изменить фоновое изображение по идентификатору раздела на странице с длинной прокруткой ⇐ CSS

[Anonymous]

Я адаптирую шаблон HTML5UP (Astral: https://html5up.net/astral) и столкнулся с проблемой. Я бы хотел, чтобы фоновое изображение менялось с каждым идентификатором, но всякий раз, когда я пытаюсь применить решения с помощью JavaScript или CSS, оно изменяет фон этого конкретного раздела (который я не хочу менять), а не фон всего страница. Демо-проект можно найти здесь: https://madisonpjones.com/projects/nwp
Пример ошибки можно увидеть на этой странице:
https:// madisonpjones.com/projects/nwp/#about
Фон раздела должен выглядеть следующим образом:
https://madisonpjones.com/projects/nwp/#visualize< /p>
Другими словами, я хотел бы сохранить белый фон для раздела, изменив фактический фон.
Решение, которое я использовал (это выдает ошибку) было следующее:

Код: Выделить всё

  
// Change background image using pure JavaScript
document.getElementById('about').style.backgroundImage =
'url("assets/css/images/overlay.png"),
url("assets/css/images/bg2.png"),
url("assets/css/images//bg.jpg")';

Для контекста: тема Astral представляет собой длинную страницу с прокруткой, которая была изменена для отображения разделов как отдельных страниц. Я уверен, что именно это создает проблему с фоном раздела, но я не могу понять, как это сделать.
Я пробовал просматривать многочисленные страницы/форумы и не нашел подходящего варианта. решение. Я вижу множество вариантов изменения фона на обычном сайте с помощью JS или CSS, но в данном случае я не могу заставить ни один из них работать. Заранее спасибо за помощь!

Подробнее здесь: https://stackoverflow.com/questions/784 ... lling-page