Mail.ru
Почта
Мой Мир
Одноклассники
ВКонтакте
Игры
Знакомства
Новости
Календарь
Облако
Заметки
Все проекты
Все проекты
выход
Регистрация
Вход
Категории
Все вопросы проекта
Компьютеры, Интернет
Темы для взрослых
Авто, Мото
Красота и Здоровье
Товары и Услуги
Бизнес, Финансы
Наука, Техника, Языки
Философия, Непознанное
Города и Страны
Образование
Фотография, Видеосъемка
Гороскопы, Магия, Гадания
Общество, Политика, СМИ
Юридическая консультация
Досуг, Развлечения
Путешествия, Туризм
Юмор
Еда, Кулинария
Работа, Карьера
О проектах Mail.ru
Животные, Растения
Семья, Дом, Дети
Другое
Знакомства, Любовь, Отношения
Спорт
Золотой фонд
Искусство и Культура
Стиль, Мода, Звезды
Полный список
Спросить
Лидеры
Поиск по вопросам
Ответы Mail.ru
Программирование
Android
C/C++
C#
iOS
Java
JavaScript
jQuery
SQL
Perl
PHP
Python
Веб-дизайн
Верстка, CSS, HTML, SVG
Системное администрирование
Другие языки и технологии
Вопросы - лидеры.
Как установить скрипт на pytnon в termux?
1 ставка
Помогите с запросом базы данных Acces
1 ставка
Помогите пожалуйста по информатике паскаль циклы
1 ставка
Я создаю моды на Java. И я решил сделать голосование за мобов, но идей, вообще нету! Поможете с идеей для мобов?
1 ставка
Помогите у меня в рпг мейкер персонажи всегда промахиваются!
1 ставка
Лидеры категории
Лена-пена
Искусственный Интеллект
М.И.
Искусственный Интеллект
Y.Nine
Искусственный Интеллект
•••
Как сделать динамическую подсветку, получается сделать чтобы каждый раз строку вручную писать, как сделать чтобы текст
Артур17823837 Полотов17823827
Ученик
(21), открыт
1 неделю назад
Сразу вставить, чтобы не проставлять <p> каждый раз. Джипити тупит.
<!DOCTYPE html>
<html>
<head>
<title>Динамическая подсветка строк</title>
<style>
.highlight {
background-color: yellow;
}
</style>
</head>
<body>
<div id="text-container">
<p>Первая строка текста.</p>
<p>Вторая строка текста.</p>
<p>Третья строка текста.</p>
<p>Четвертая строка текста.</p>
<p>Пятая строка текста.</p>
<p>Шестая строка текста.</p>
<p>Седьмая строка текста.</p>
</div>
<script src="script.js"></script>
</body>
</html>
JavaScript
const textContainer = document.getElementById("text-container");
const lines = textContainer.querySelectorAll("p");
let currentLineIndex = 0;
function highlightLine() {
if (currentLineIndex < lines.length) {
lines[currentLineIndex].classList.add("highlight");
setTimeout(() => {
lines[currentLineIndex].classList.remove("highlight");
currentLineIndex++;
highlightLine();
}, 250); // Задержка уменьшена до 250 миллисекунд
}
}
highlightLine();
0 ответов
Похожие вопросы
<!DOCTYPE html>
<html>
<head>
<title>Динамическая подсветка строк</title>
<style>
.highlight {
background-color: yellow;
}
</style>
</head>
<body>
<div id="text-container">
<p>Первая строка текста.</p>
<p>Вторая строка текста.</p>
<p>Третья строка текста.</p>
<p>Четвертая строка текста.</p>
<p>Пятая строка текста.</p>
<p>Шестая строка текста.</p>
<p>Седьмая строка текста.</p>
</div>
<script src="script.js"></script>
</body>
</html>
JavaScript
const textContainer = document.getElementById("text-container");
const lines = textContainer.querySelectorAll("p");
let currentLineIndex = 0;
function highlightLine() {
if (currentLineIndex < lines.length) {
lines[currentLineIndex].classList.add("highlight");
setTimeout(() => {
lines[currentLineIndex].classList.remove("highlight");
currentLineIndex++;
highlightLine();
}, 250); // Задержка уменьшена до 250 миллисекунд
}
}
highlightLine();