Как поменять задний фон при этом не трогая что находится спереди (html css js)

Question

Как поменять задний фон при этом не трогая что находится спереди (html css js)

Динар Салахов Ян Ученик (92), на голосовании 11 месяцев назад

Нужно чтобы фон менялся автоматический каждые 5 секунд, либо менять мышкой с помощью слайда направо или налево
Снизу сделать полоску которая будет показывать сколько осталось до смены фона, либо просто нажать на интересующую

Answer 1

Чтобы реализовать это, вам потребуется использовать JavaScript для изменения фона и создания слайдера, а также CSS для стилизации полоски прогресса. Вот примерный код для выполнения такой задачи:

HTML:

```html
<body id="body">
<div id="content">

</div>
<div id="progressBar" style="height:10px"></div>
</body>
```

CSS:

```css
#progressBar {
width: 0%;
background: red;
transition: width 0.1s linear;
}
```
JavaScript:

```javascript
let body = document.getElementById('body');
let progressBar = document.getElementById('progressBar');
let backgrounds = ['url(1.jpg)', 'url(2.jpg)', 'url(3.jpg)']; // Замените на свои URL-ы
let currentBackgroundIndex = 0;
let timer;

function changeBackground() {
body.style .backgroundImage = backgrounds[currentBackgroundIndex];
currentBackgroundIndex = (currentBackgroundIndex + 1) % backgrounds.length;
}

function startTimer() {
let timeLeft = 5;
timer = setInterval(() => {
timeLeft--;
progressBar.style .width = ((5 - timeLeft) / 5) * 100 + '%';
if (timeLeft === 0) {
changeBackground();
timeLeft = 5;
}
}, 1000);
}

body.addEventListener('click', () => {
clearInterval(timer);
changeBackground();
startTimer();
});

startTimer();
```

Answer 2

Александр Искусственный Интеллект (301726) 1 год назад

на кой лорем это хуанхэ?

Answer 3

Dlazder Мудрец (16917) 1 год назад

Фон и так задний