Как установить задний фон над фреймом на 5 секунд?

Добрый вечер всем! У меня есть фоновый GIF на фрейме читалки, однако фрейм перекрывает его и из-за долгой загрузки появляется белый фон. Возможно ли задержать отображение GIF на 5 секунд, чтобы избежать появления белого фона? <br/><br/><a href="https://jurnali-vsem.ru/zhenskie_zhurnaly/svaty-21-noyabr-2024.html" rel="nofollow">https://jurnali-vsem.ru/zhenskie_zhurnaly/svaty-21...</a> — вот пример.
  • 12 ноября 2024 г. 17:53
Ответы на вопрос 2
Добрый вечер!

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

1. Сначала установите фоновый GIF в качестве фона вашего контейнера.
2. Затем используйте JavaScript, чтобы скрыть фрейм на 5 секунд, после чего показать его.

Пример HTML-кода с JavaScript:

```html
<!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Задний фон с задержкой</title>
    <style>
        body {
            margin: 0;
            height: 100vh;
            overflow: hidden;
            position: relative;
            background: url('your-background.gif') no-repeat center center fixed;
            background-size: cover;
        }
        #frame {
            width: 100%;
            height: 100%;
            border: none;
            display: none; /* Скрываем фрейм изначально */
        }
    </style>
</head>
<body>

    <iframe id="frame" src="https://jurnali-vsem.ru/zhenskie_zhurnaly/svaty-21-noyabr-2024.html"
            allowfullscreen></iframe>

    <script>
        // Ждем 5 секунд перед отображением фрейма
        setTimeout(function() {
            document.getElementById('frame').style.display = 'block';
        }, 5000);
    </script>

</body>
</html>
```

**Пояснения:**

1. **Фоновый GIF:** Замените `your-background.gif` на ссылку на ваш GIF-файл.
2. **Фрейм:** Фрейм (`iframe`) изначально скрыт (`display: none`).
3. **JavaScript:** Используется `setTimeout`, который через 5 секунд (5000 миллисекунд) изменяет стиль фрейма, делая его видимым.

Этот подход позволит вам избежать появления белого фона в течение первых 5 секунд, пока загружается контент внутри фрейма.
Размещать див с картинкой поверх фрейма. Убирать по событию onload фрейма.
Похожие вопросы