<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div id="features">
<!-- блок с секциями -->
<div id="main-block">
<!-- секция с показателями кислорода -->
<section class="oxygen-saturation">
<img src="assets/services/heart.svg" alt="Сердце" width="45px">
<h2>Измерение уровня кислорода в крови</h2>
<p>Измеряйте уровень насыщения крови кислородом в любой момент прямо со своего запястья.</p>
</section>
<!-- секция с отслеживанием сна -->
<section class="sleep-tracking">
<img src="assets/services/clock.svg" alt="Часы" width="45px">
<h2>Отслеживание сна</h2>
<p>Настройте цель сна, время отхода ко сну и время пробуждения, а также отслеживайте свой прогресс.</p>
</section>
<!-- секция с обнаружением мытья рук -->
<section class="hand-washing-detection">
<img src="assets/services/wash.svg" alt="Мыло" width="45px">
<h2>Обнаружение мытья рук</h2>
<p>Часы автоматически обнаруживают, что вы начали мыть руки, и устанавливают таймер на 20 секунд.</p>
</section>
</div>
</div>
</body>
</html>
progressbar.addEventListener('click', (event) => {
event.preventDefault();
// Получаем позицию и размеры прогресс-бара
const rect = progressbar.getBoundingClientRect();
// Вычисляем новое время на основе положения клика
const newTime = ((event.clientX - rect.left) / rect.width) * video.duration;
console.log('New time:', newTime);
if (video && progressbar) {
video.currentTime = newTime;
} else {
console.error('Видео или прогрессбар не найден');
}
});
<?php
// Создаём DOM из строки
$html = str_get_html('
<div id="hello">Hello</div>
<div id="world">World</div>
');
// Ищем элемент 'div' с 'id="hello"' и меняем его содержимое на 'foo'
$html->find('div[id=hello]', 0)->innertext = 'foo';
// Ищем второй элемент 'div' по порядку и добавляем ему класс 'bar'
$html->find('div', 1)->class = 'bar';
echo $html;
// Результат:
// <div id="hello">foo</div>
// <div id="world" class="bar">World</div>
?>
<h2>Greetings</h2>
<div class="container">
<div class="inner">Hello</div>
<div class="inner">Goodbye</div>
</div>
$('.container').append($('h2'));
<div class="container">
<div class="inner">Hello</div>
<div class="inner">Goodbye</div>
<h2>Greetings</h2>
</div>
$('.container').prepend('<h1>Hello World!</h1>');
<h2>Greetings</h2>
<div class="container">
<h1>Hello World!</h1>
<div class="inner">Hello</div>
<div class="inner">Goodbye</div>
</div>