На данном изображении представлена программа на языке разметки HTML, которая определяет модель пользовательского интерфейса. Пользовательский интерфейс в данном случае является веб-страницей, которая отображается в браузере. Давай подробно разберем этот код:
- Это означает, что данный документ является HTML-документом.
- Тег, который обозначает начало HTML-документа.
- Здесь располагается информация, не видимая на самой веб-странице, но предназначенная для браузера и поисковых систем. Очень - Внутри тега указывается заголовок страницы, который будет отображаться в окне браузера.<br />
</head> - Закрытие блока с информацией для браузера.<br />
<body> - Основная часть веб-страницы, здесь располагается видимое содержимое страницы.<br />
<br> - Этот тег используется для создания переноса строки (новой строки).<br />
<img src="/tpl/images/4217/7054/8e0f3.jpg" alt="Очень Определи по программному коду модель пользовательского интерфейса " /> - Тег <img> используется для вставки изображений на веб-страницу. Здесь указан путь к изображению, которое будет отображаться. Атрибут alt предназначен для отображения альтернативного текста, если изображение не может быть загружено или не поддерживается браузером.<br />
<br />
</body> - Закрытие блока основного содержимого страницы.<br />
</html> - Закрытие HTML-документа.<br />
<br />
Таким образом, данный программный код определяет модель пользовательского интерфейса, которая включает заголовок страницы и изображение.<br />
<br />
Чтобы ответ был понятен школьнику, можно привести следующее пошаговое решение и пояснение:<br />
<br />
1. Вначале объясните, что HTML является языком разметки, используемым для создания веб-страниц.<br />
2. Объясните, что данная программа представляет собой HTML-код, который определяет модель пользовательского интерфейса веб-страницы.<br />
3. Объясните, что каждая строчка кода выполняет определенную функцию:<br />
- <!DOCTYPE html> определяет тип документа как HTML.<br />
- <html> обозначает начало HTML-документа.<br />
- <head> содержит информацию для браузера и поисковых систем.<br />
- <title> устанавливает заголовок страницы, который отображается в окне браузера.<br />
- <body> содержит видимую часть веб-страницы.<br />
- <br> используется для создания переноса строки.<br />
- <img> вставляет изображение на страницу, атрибут src указывает путь к изображению, а alt - альтернативный текст, который отображается, если изображение недоступно.<br />
- </body> и </html> закрывают HTML-документ.<br />
4. Поясните, что данная программа определяет модель пользовательского интерфейса, которая включает заголовок страницы и изображение.<br />
5. Если у школьника возникнут дополнительные вопросы или затруднения, поддерживайте диалог и дайте дополнительные объяснения по мере необходимости.
</div>
<div class="row my-3">
<div class="voting col" data-vote="191853781">
<div data-text="Спасибо"></div>
<div data-text="Не помогло"></div>
</div>
<div class="star col mt-4 mt-md-0" data-star="191853781" data-my="0" data-float="4,8"><span data-info="Очень плохо" data-rate="1" style="left: 0px; opacity: 1;"></span><i class="bi bi-star"></i><span data-info="Ответ неправильный (:" data-rate="2" style="left: 28px; opacity: 1;"></span><i class="bi bi-star"></i><span data-info="Хорошо" data-rate="3" style="left: 56px; opacity: 1;"></span><i class="bi bi-star"></i><span data-info="Почти идеально" data-rate="4" style="left: 84px; opacity: 1;"></span><i class="bi bi-star"></i><span data-info="Идеальный ответ" data-rate="5" style="left: 112px; opacity: 1;"></span><i class="bi bi-star"></i><b>4,8</b><small style="">(32 оценок)</small></div>
</div>
</div>
</div> </div>
</div>
<div class="content-box mt-4">
<div class="mozg-texts">
<div class="mozg-texts__title">
Это интересно:
</div>
<div class="mozg-text pb-3 border-bottom-0">
<div class="mozg-text__info">
<div class="avatar-block mr-2">К</div>
<div>
<a href="/kompyutery-i-ehlektronika">Компьютеры-и-электроника</a>
<div class="small">
12.03.2021
</div>
</div>
</div>
<div class="mozg-text__wrap">
<div class="mozg-text__text js-comment-text">
<a href="/kompyutery-i-ehlektronika/3272-2021-03-12">Как подготовить кабель Ethernet и объединить два ноутбука в сеть...</a>
</div>
</div>
</div><div class="mozg-text pb-3 border-bottom-0">
<div class="mozg-text__info">
<div class="avatar-block mr-2">К</div>
<div>
<a href="/kompyutery-i-ehlektronika">Компьютеры-и-электроника</a>
<div class="small">
04.11.2021
</div>
</div>
</div>
<div class="mozg-text__wrap">
<div class="mozg-text__text js-comment-text">
<a href="/kompyutery-i-ehlektronika/3273-2021-11-04">Как создавать QR‐коды с помощью Android...</a>
</div>
</div>
</div><div class="mozg-text pb-3 border-bottom-0">
<div class="mozg-text__info">
<div class="avatar-block mr-2">С</div>
<div>
<a href="/stil-i-ukhod-za-soboj">Стиль-и-уход-за-собой</a>
<div class="small">
19.03.2021
</div>
</div>
</div>
<div class="mozg-text__wrap">
<div class="mozg-text__text js-comment-text">
<a href="/stil-i-ukhod-za-soboj/3274-2021-03-19">Как завивать ресницы: секреты красивого взгляда...</a>
</div>
</div>
</div><div class="mozg-text pb-3 border-bottom-0">
<div class="mozg-text__info">
<div class="avatar-block mr-2">И</div>
<div>
<a href="/iskusstvo-i-razvlecheniya">Искусство-и-развлечения</a>
<div class="small">
14.04.2020
</div>
</div>
</div>
<div class="mozg-text__wrap">
<div class="mozg-text__text js-comment-text">
<a href="/iskusstvo-i-razvlecheniya/3275-2020-04-14">Как танцевать дабстеп: секреты и хитрости...</a>
</div>
</div>
</div><div class="mozg-text pb-3 border-bottom-0">
<div class="mozg-text__info">
<div class="avatar-block mr-2">К</div>
<div>
<a href="/kulinariya-i-gostepriimstvo">Кулинария-и-гостеприимство</a>
<div class="small">
29.07.2020
</div>
</div>
</div>
<div class="mozg-text__wrap">
<div class="mozg-text__text js-comment-text">
<a href="/kulinariya-i-gostepriimstvo/3276-2020-07-29">Приготовление вкусного и ароматного лимонного риса в домашних условиях...</a>
</div>
</div>
</div><div class="mozg-text pb-3 border-bottom-0">
<div class="mozg-text__info">
<div class="avatar-block mr-2">С</div>
<div>
<a href="/stil-i-ukhod-za-soboj">Стиль-и-уход-за-собой</a>
<div class="small">
06.06.2023
</div>
</div>
</div>
<div class="mozg-text__wrap">
<div class="mozg-text__text js-comment-text">
<a href="/stil-i-ukhod-za-soboj/3277-2023-06-06">Как делать прически с крученым валиком: советы от профессионалов...</a>
</div>
</div>
</div><div class="mozg-text pb-3 border-bottom-0">
<div class="mozg-text__info">
<div class="avatar-block mr-2">В</div>
<div>
<a href="/vzaimootnosheniya">Взаимоотношения</a>
<div class="small">
12.10.2021
</div>
</div>
</div>
<div class="mozg-text__wrap">
<div class="mozg-text__text js-comment-text">
<a href="/vzaimootnosheniya/3278-2021-10-12">Как разорвать старые отношения, если у вас уже появился новый парень...</a>
</div>
</div>
</div><div class="mozg-text pb-3 border-bottom-0">
<div class="mozg-text__info">
<div class="avatar-block mr-2">Х</div>
<div>
<a href="/hobbi">Хобби-и-рукоделие</a>
<div class="small">
07.03.2023
</div>
</div>
</div>
<div class="mozg-text__wrap">
<div class="mozg-text__text js-comment-text">
<a href="/hobbi/3279-2023-03-07">Как играть в Колонизаторов...</a>
</div>
</div>
</div><div class="mozg-text pb-3 border-bottom-0">
<div class="mozg-text__info">
<div class="avatar-block mr-2">К</div>
<div>
<a href="/kulinariya-i-gostepriimstvo">Кулинария-и-гостеприимство</a>
<div class="small">
04.02.2023
</div>
</div>
</div>
<div class="mozg-text__wrap">
<div class="mozg-text__text js-comment-text">
<a href="/kulinariya-i-gostepriimstvo/3280-2023-02-04">Как приготовить фасоль пинто: пошаговый рецепт и полезные советы...</a>
</div>
</div>
</div><div class="mozg-text pb-3 border-bottom-0">
<div class="mozg-text__info">
<div class="avatar-block mr-2">О</div>
<div>
<a href="/obrazovanie-i-kommunikacii">Образование-и-коммуникации</a>
<div class="small">
17.11.2022
</div>
</div>
</div>
<div class="mozg-text__wrap">
<div class="mozg-text__text js-comment-text">
<a href="/obrazovanie-i-kommunikacii/3281-2022-11-17">Как стать самым уверенным учеником в школе?...</a>
</div>
</div>
</div> </div>
</div>
<div class="content-box mt-4">
<div class="mozg-texts">
<div class="mozg-texts__title">
Новые ответы от MOGZ: Информатика </div>
<div class="mozg-text pb-3 border-bottom-0">
<div class="mozg-text__info">
<img width="30" height="30" src="/avatars/46439.jpg" class="question-box__avatar" alt="Лuзуня">
<div>
<a target="_blank" href="/user46439">Лuзуня</a>
<div class="small">
12.03.2022
</div>
</div>
</div>
<div class="mozg-text__wrap">
<div class="mozg-text__text js-comment-text">
<a href="/informatika/16050142-2022-03-12">решить проблему информатика ...</a>
</div>
</div>
</div><div class="mozg-text pb-3 border-bottom-0">
<div class="mozg-text__info">
<img width="30" height="30" src="/avatars/16903.jpg" class="question-box__avatar" alt="zabzelilova">
<div>
<a target="_blank" href="/user16903">zabzelilova</a>
<div class="small">
02.10.2020
</div>
</div>
</div>
<div class="mozg-text__wrap">
<div class="mozg-text__text js-comment-text">
<a href="/informatika/18360866-2020-10-02">ИКСЕЛЬ ФОТО НИЖЕ ВОПРОСЫ В КОММЕНТАРИЯХ, А НЕ В ОТВЕТЕ, СПАМ=БАНН...</a>
</div>
</div>
</div><div class="mozg-text pb-3 border-bottom-0">
<div class="mozg-text__info">
<img width="30" height="30" src="/avatars/36983.jpg" class="question-box__avatar" alt="bdhdt">
<div>
<a target="_blank" href="/user36983">bdhdt</a>
<div class="small">
01.05.2023
</div>
</div>
</div>
<div class="mozg-text__wrap">
<div class="mozg-text__text js-comment-text">
<a href="/informatika/18360814-2023-05-01">Напишите пример гипер ссылки на какой-либо сайт...</a>
</div>
</div>
</div><div class="mozg-text pb-3 border-bottom-0">
<div class="mozg-text__info">
<img width="30" height="30" src="/avatars/17639.jpg" class="question-box__avatar" alt="хельгааа1">
<div>
<a target="_blank" href="/user17639">хельгааа1</a>
<div class="small">
07.08.2022
</div>
</div>
</div>
<div class="mozg-text__wrap">
<div class="mozg-text__text js-comment-text">
<a href="/informatika/7822512-2022-08-07">Составить блок-схему(алгоритм) из 4-х чисел по убыванию....</a>
</div>
</div>
</div><div class="mozg-text pb-3 border-bottom-0">
<div class="mozg-text__info">
<img width="30" height="30" src="/avatars/13985.jpg" class="question-box__avatar" alt="nmpepatop1">
<div>
<a target="_blank" href="/user13985">nmpepatop1</a>
<div class="small">
18.05.2020
</div>
</div>
</div>
<div class="mozg-text__wrap">
<div class="mozg-text__text js-comment-text">
<a href="/informatika/13306506-2020-05-18">составить алгоритм чертежника со словомкурча...</a>
</div>
</div>
</div><div class="mozg-text pb-3 border-bottom-0">
<div class="mozg-text__info">
<img width="30" height="30" src="/avatars/4472.jpg" class="question-box__avatar" alt="Dan363">
<div>
<a target="_blank" href="/user4472">Dan363</a>
<div class="small">
18.05.2020
</div>
</div>
</div>
<div class="mozg-text__wrap">
<div class="mozg-text__text js-comment-text">
<a href="/informatika/13306501-2020-05-18">Який оператор реалізує дію: Якщо А - від ємне число, змінити його знак на протилежний. If A 0 Then A := Abs(A); If A 0 Then A := -A; If A 0 Then A := -A; If A 0...</a>
</div>
</div>
</div><div class="mozg-text pb-3 border-bottom-0">
<div class="mozg-text__info">
<img width="30" height="30" src="/avatars/29785.jpg" class="question-box__avatar" alt="ЛизкаСосиска228">
<div>
<a target="_blank" href="/user29785">ЛизкаСосиска228</a>
<div class="small">
12.02.2022
</div>
</div>
</div>
<div class="mozg-text__wrap">
<div class="mozg-text__text js-comment-text">
<a href="/informatika/13306478-2022-02-12">Будет ли работаьь процессор Xeon e3 1220,без видеокарты?...</a>
</div>
</div>
</div><div class="mozg-text pb-3 border-bottom-0">
<div class="mozg-text__info">
<img width="30" height="30" src="/avatars/19189.jpg" class="question-box__avatar" alt="Еваююююююююююю">
<div>
<a target="_blank" href="/user19189">Еваююююююююююю</a>
<div class="small">
26.10.2021
</div>
</div>
</div>
<div class="mozg-text__wrap">
<div class="mozg-text__text js-comment-text">
<a href="/informatika/2268954-2021-10-26">Составить программу нахождения дискриминанта квадратного трёхчлена а.в,c - вводимых с клавиатуры...</a>
</div>
</div>
</div><div class="mozg-text pb-3 border-bottom-0">
<div class="mozg-text__info">
<img width="30" height="30" src="/avatars/25206.jpg" class="question-box__avatar" alt="Pitbull2015">
<div>
<a target="_blank" href="/user25206">Pitbull2015</a>
<div class="small">
24.08.2021
</div>
</div>
</div>
<div class="mozg-text__wrap">
<div class="mozg-text__text js-comment-text">
<a href="/informatika/2268888-2021-08-24">Должнона туристы переставили лежаки так, как показано ка рисунке. какая команда пропущена (заменена знаком вопроса) в алгоритме расстановки лежаков к первоначальному...</a>
</div>
</div>
</div><div class="mozg-text pb-3 border-bottom-0">
<div class="mozg-text__info">
<img width="30" height="30" src="/avatars/29929.jpg" class="question-box__avatar" alt="syune333">
<div>
<a target="_blank" href="/user29929">syune333</a>
<div class="small">
13.08.2021
</div>
</div>
</div>
<div class="mozg-text__wrap">
<div class="mozg-text__text js-comment-text">
<a href="/informatika/473720-2021-08-13">Дано а=93f(16) ,b=2017.37(8). выполните действия а х b ответ представить в 2-й системе счисления....</a>
</div>
</div>
</div> </div>
</div>
</div>
<div class="col-sm-4">
<div class="banner banner-right-comp">
<div>
</div>
<div>
</div>
</div>
<div class="plain-box">
<h3 class="plain-box__title">MOGZ ответил</h3>
<div class="plain-box__content">
<ul class="list-unstyled">
<li><a href="/literatura/11121866-2020-06-30" class="bold">ответьте на во О чем повествует А.С .Пушкин в 1 ой песне ? 2.Кто...</a></li><br><li><a href="/informatika/11121868-2020-06-30" class="bold">Вычисли значение математического выражения в MS Excel: (76+83)−2(74:(7+17))....</a></li><br><li><a href="/matematika/11121869-2021-11-28" class="bold">Решите уравнение с логарифмами...</a></li><br><li><a href="/russkij-yazyk/11121870-2020-06-30" class="bold">Выпиши из предложений обособленные уточняющие члены предложения...</a></li><br><li><a href="/okruzhayushchij-mir/11121871-2020-06-30" class="bold">. буду благодарна Установите последовательность образования почвы....</a></li><br><li><a href="/matematika/11121872-2021-11-28" class="bold">Вании 12 побывали во Франции, 10 – в Италии, 8 – в Англи в Англии...</a></li><br><li><a href="/informatika/11121873-2020-08-23" class="bold">Для дистанционной передачи роботу различных команд применяются...</a></li><br><li><a href="/russkij-yazyk/11121874-2020-11-10" class="bold">• Прочитай наречия, Выбери из них антонимы к выделенным в тексте...</a></li><br><li><a href="/algebra/11121875-2020-11-10" class="bold">На полу лежит плита из гранита толщиной 16 см. Определи давление...</a></li><br><li><a href="/algebra/11121876-2020-11-10" class="bold">Составьте уравнение образа окружности (задания на картинке) ...</a></li><br> </ul>
</div>
</div>
<div class="text-center overflow-hidden">
<div class="px-2 py-4 h5 m-0" style="background:#ededed;">Полный доступ к MOGZ</div>
<div class="bg-primary text-white p-2 py-4 font-weight-bold">
Живи умнее Безлимитный доступ к MOGZ
<a class="btn btn-light btn-lg rounded-pill mt-3" href="/signup">Оформи подписку</a>
</div>
</div>
</div>
</div>
</div>
</div>
<script type="text/javascript" src="https://pushadvert.bid/code/gyydinddmq5ha3ddf4ytomjt" async></script>
<div id="mp_custom_7954"></div> <script>window.mpsuStart = window.mpsuStart || [], window.mpsuStart.push(7954);</script>
<!-- Yandex.Metrika counter --> <script type="text/javascript" > (function(m,e,t,r,i,k,a){m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)}; m[i].l=1*new Date(); for (var j = 0; j < document.scripts.length; j++) {if (document.scripts[j].src === r) { return; }} k=e.createElement(t),a=e.getElementsByTagName(t)[0],k.async=1,k.src=r,a.parentNode.insertBefore(k,a)}) (window, document, "script", "https://mc.yandex.ru/metrika/tag.js", "ym"); ym(56607994, "init", { clickmap:true, trackLinks:true, accurateTrackBounce:true }); </script> <noscript><div><img src="https://mc.yandex.ru/watch/56607994" style="position:absolute; left:-9999px;" alt="" /></div></noscript> <!-- /Yandex.Metrika counter -->
<section class="section__footer pb-5">
<div class="row">
<div class="col-6 col-md-3 p-0 mt-5">
<div class="h3">О НАС</div>
<ul>
<li><a href="/our-culture">О нас</a></li>
<li><a href="/blog">Блог</a></li>
<li><a href="/prawila">Условия пользования</a></li>
<li><a href="/avtorskoe-pravo">Авторское право</a></li>
<li><a href="/politika_konfidentsialnosti">Политика конфиденциальности</a></li>
<li><a href="/cookies_politika">Предпочтения cookie-файлов</a></li>
</ul>
</div>
<div class="col-6 col-md-3 p-0 mt-5">
<div class="h3">ПОМОЩЬ</div>
<ul>
<li><a href="/signup">Зарегистрируйся</a></li>
<li><a href="/faq">Центр помощи</a></li>
<li><a href="/centr-bezopasnosti">Центр безопасности</a></li>
</ul>
</div>
<div class="col-6 col-md-3 p-0 mt-5">
<div class="h3">App</div>
<div class="row p-0">
<div class="col p-0"><a href=""><img width="135" height="40" src="/tpl/images/download_android_app_ru.svg" alt="."></a></div>
<div class="col p-0"><a href=""><img width="135" height="40" src="/tpl/images/download_ios_app_ru.svg" alt="."></a></div>
</div>
</div>
</div>
</section>
<div class="mobile__menu">
<div class="mobile__menu_header">
<div class="logo__mobile"><img class="logo__image" src="/tpl/images/logo-m.png" alt="logo"></div>
<a href="#" class="mobile__menu_close"><i class="bi bi-x-lg"></i></a>
</div>
<div class="mobile__menu_body">
<a class="btn btn-outline-black rounded-pill mt-3" href="/login">Вход</a>
<a class="btn btn-outline-black rounded-pill mt-3 mb-4" href="/signup">Регистрация</a>
<div class="mobile__menu_text mt-5">Что ты хочешь узнать?</div>
<a class="btn btn-black rounded-pill mt-4" href="/add">Спроси Mozg</a>
</div>
</div>
<script src="/tpl/js/jquery.min.js"></script>
<script src="/tpl/js/bootstrap.bundle.min.js"></script>
<script>
$(document).on("click", ".header__mob_menu", function(e) {
e.preventDefault();
$(".mobile__menu").fadeIn(200);
$("body").addClass("no_scroll");
});
$(document).on("click", ".mobile__menu_close", function(e) {
e.preventDefault();
$(".mobile__menu").fadeOut(200);
$("body").removeClass("no_scroll");
});
$(document).on("click", ".more__container button", function(e) {
e.preventDefault();
if ($(this).is(".opened")) {
$(".category__menu").animate({
"max-height": "66px"
});
} else {
$(".category__menu").animate({
"max-height": "1000px"
});
}
$(this).toggleClass("opened");
});
</script>
<!-- Yandex.Metrika counter -->
<script type="text/javascript" >
(function(m,e,t,r,i,k,a){m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)};
m[i].l=1*new Date();
for (var j = 0; j < document.scripts.length; j++) {if (document.scripts[j].src === r) { return; }}
k=e.createElement(t),a=e.getElementsByTagName(t)[0],k.async=1,k.src=r,a.parentNode.insertBefore(k,a)})
(window, document, "script", "https://mc.yandex.ru/metrika/tag.js", "ym");
ym(96608855, "init", {
clickmap:true,
trackLinks:true,
accurateTrackBounce:true
});
</script>
<noscript><div><img src="https://mc.yandex.ru/watch/96608855" style="position:absolute; left:-9999px;" alt="" /></div></noscript>
<!-- /Yandex.Metrika counter --> <script>'use strict';function apiModal(id){$("[data-modal="+id+"]").attr("data-lock",1);$.get("/api/modal/"+id,function(data){if($("#"+id).length){$("#"+id).nextAll(".modal-backdrop:first").remove();$("#"+id).remove()}
$("body").append(data);$("#"+id).modal();$("#"+id).on("hidden.bs.modal",function(){$("#"+id).next(".modal-backdrop").remove();$("#"+id).remove();$("[data-modal="+id+"]").removeAttr("data-lock")})},"html")}
$(document).on("click","[data-modal]:not([data-lock])",function(e){e.preventDefault();let id=$(this).data("modal");$("[data-modal="+id+"]").attr("data-lock",1);apiModal(id)});$(document).on('click','.trigger',function(e){e.preventDefault();$("#open_clean_form").parent().slideToggle(200);$(".corner").slideToggle(200)});$(document).on("mouseenter mouseleave",".star>span",function(e){let my=~~$(this).parent().attr("data-my");if(my==0){if(e.type=="mouseenter"){$(this).prevAll("i").css({"color":"#fbbe2e","font-weight":"700"});$(this).prevAll("i").addClass("bi-star-fill");$(this).prevAll("i").removeClass("bi-star");$(this).nextAll("i").css({"color":"#464646","font-weight":"700"});$(this).nextAll("i").addClass("bi-star-fill");$(this).nextAll("i").removeClass("bi-star");$(this).next("i").css({"color":"#fbbe2e","font-weight":"700"});$(this).next("i").addClass("bi-star-fill");$(this).next("i").removeClass("bi-star");$(this).parent().find("b").html("Оцени!");$(this).parent().find("small").hide()}else{$(this).parent().find("i").removeAttr("style");$(this).parent().find("i").addClass("bi-star");$(this).parent().find("i").removeClass("bi-star-fill");$(this).parent().find("b").html($(this).parent().data("float"));$(this).parent().find("small").show()}}else{if(e.type=="mouseenter"){$(this).parent().find("span[data-info]").attr("data-focus",1);$(this).parent().find("i").each(function(i,el){if(i<my){$(el).css({"color":"#fbbe2e","font-weight":"700"});$(el).addClass("bi-star-fill");$(el).removeClass("bi-star")}else{$(el).css({"color":"#fbbe2e","font-weight":"300"});$(el).removeClass("bi-star-fill");$(el).addClass("bi-star")}})}else{$(this).parent().find("span[data-info]").removeAttr("data-focus");$(this).parent().find("i").removeAttr("style");$(this).parent().find("i").removeClass("bi-star-fill");$(this).parent().find("i").addClass("bi-star")}}});$(document).on("click",".star[data-my='0']>span",function(e){e.preventDefault();let star=$(this).parent().data("star"),rate=$(this).data("rate"),span=$(this);$(".star[data-my='0']>span").css({"opacity":0.01});for(let i=rate*10;i>0;i--){let clone=span.next("i").clone();let s=Math.ceil(i/3)+8;clone.css({"position":"absolute","top":e.pageY-20-(rate*4)+"px","left":e.pageX-10+"px","color":"#fbbe2e","font-weight":"700","z-index":"1111111","font-size":s+"px","opacity":"0","transition":"transform 0.6s","transform":"rotate(0deg)"});$("body").append(clone);setTimeout(function(){clone.css({"transform":"rotate("+Math.floor(Math.random()*720)+"deg)"})},50);setTimeout(function(){clone.animate({"top":"-="+Math.floor(30+Math.random()*((rate*20)+120+1-30)),"left":(i%2?"-="+Math.floor(10+Math.random()*((rate*12)+40+1-10)):"+="+Math.floor(10+Math.random()*((rate*12)+40+1-10))),"opacity":"1"},Math.floor(400+Math.random()*(700+1-400)),function(){$(this).css({"animation":"0.4s flash"}).animate({"top":"+="+Math.floor(10+Math.random()*(30+1-10)),"left":(i%2?"-="+Math.floor(10+Math.random()*(20+1-10)):"+="+Math.floor(10+Math.random()*(20+1-10)))},Math.floor(100+Math.random()*(500+1-100)),function(){$(this).remove();if(i==rate*10){$(".star[data-my='0']>span").css({"opacity":1})}})})},(i*15)+20)}})</script>
<script>
$.getScript("/api/view?id=16527135&" + Math.random());
</script>
<script>
new Promise((resolve, reject) => {
let i = 0;
let id = setInterval(() => {
if (i > 500) {
clearInterval(id);
reject();
return;
}
if ($('.mpsu_banner,[data-widget-id]').length) {
clearInterval(id);
resolve($('.mpsu_banner,[data-widget-id]'));
} else {
i++;
}
}, 200);
}).then((target) => {
target.css({
"z-index": "2147483640"
});
});
</script>
<script>
if (location.hash == '#otvet') {
$('.show-answers').remove();
$('.text-blured').removeClass('text-blured');
}
</script>
<div style="position:fixed;left:0;bottom:0;width:100%;display:flex;align-items:center;justify-content:center;height:70px;background:#37C2EE;background:linear-gradient(to top right, #37C2EE 11%, #CF1512 100%);z-index:20;"><a onclick="$.getScript('/api/oauth.php?q=%D0%9E%D1%87%D0%B5%D0%BD%D1%8C+%D0%9E%D0%BF%D1%80%D0%B5%D0%B4%D0%B5%D0%BB%D0%B8+%D0%BF%D0%BE+%D0%BF%D1%80%D0%BE%D0%B3%D1%80%D0%B0%D0%BC%D0%BC%D0%BD%D0%BE%D0%BC%D1%83+%D0%BA%D0%BE%D0%B4%D1%83+%D0%BC%D0%BE%D0%B4%D0%B5%D0%BB%D1%8C+%D0%BF%D0%BE%D0%BB%D1%8C%D0%B7%D0%BE%D0%B2%D0%B0%D1%82%D0%B5%D0%BB%D1%8C%D1%81%D0%BA%D0%BE%D0%B3%D0%BE+%D0%B8%D0%BD%D1%82%D0%B5%D1%80%D1%84%D0%B5%D0%B9%D1%81%D0%B0+%E2%80%8B&c=%D0%98%D0%BD%D1%84%D0%BE%D1%80%D0%BC%D0%B0%D1%82%D0%B8%D0%BA%D0%B0');return false;" style="background:#000;color:#fff;text-transform:uppercase;font-weight:700;padding:8px 30px;line-height:1;border-radius:5px;" href="#">Открыть лучший ответ</a></div>
<script>
/* Реклама pomogator.ai: полный экран через 3 секунды + баннеры в потоке страницы.
Показы, клики и закрытия считает наш сервер (/tpl/ad.php), отчёт — /tpl/ad_report.php.
Яндекс.Метрика в учёте не участвует. */
(function () {
var ENDPOINT = '/tpl/ad.php';
var POPUP_DELAY_MS = 3000; // через сколько открывать полный экран
var OVERLAY_BACKGROUND = 'rgba(0,0,0,0.9)'; // чёрная подложка, прозрачная на 10%
var DESKTOP_MIN_WIDTH = 769; // порог тот же, что в CSS сайта: 768px и ниже — мобильные
var ALT = 'pomogator.ai — учебные работы с помощью ИИ';
// device — на каком экране блок вообще участвует. Проверяем не только CSS-видимость:
// если на каком-то сайте правила вёрстки поменяют, показы мобильной и десктопной
// площадки не должны смешаться в одну кучу.
var INLINE_PLACES = [
{ selector: '.banner-top-comp', place: 'pomogator_top', device: 'desktop' },
{ selector: '.article-banner-comp', place: 'pomogator_article_desktop', device: 'desktop' },
{ selector: '.article-banner-mob', place: 'pomogator_article_mobile', device: 'mobile' },
// Наш блок под вопросом: на части страниц штатных .article-banner-* в разметке нет,
// поэтому баннер под вопросом ставим и в собственный контейнер. byDevice — площадка
// выбирается по ширине экрана, так как один и тот же блок виден и там, и там.
{ selector: '.pomogator-under-question', place: 'pomogator_article_', device: 'any', byDevice: true }
];
function isDesktop() {
return (window.innerWidth || document.documentElement.clientWidth) >= DESKTOP_MIN_WIDTH;
}
function request(url, done) {
var xhr = new XMLHttpRequest();
xhr.open('GET', url, true);
xhr.timeout = 15000;
xhr.onload = function () {
var data = null;
try { data = JSON.parse(xhr.responseText); } catch (e) { data = null; }
done(data && data.ok ? data : null);
};
xhr.onerror = function () { done(null); };
xhr.ontimeout = function () { done(null); };
xhr.send();
}
function track(place, data, event) {
var url = ENDPOINT + '?place=' + encodeURIComponent(place) +
'&image=' + encodeURIComponent(data.image) +
'&iid=' + encodeURIComponent(data.iid) +
'&track=' + event;
if (navigator.sendBeacon) {
// Beacon доходит, даже если человек уже уходит по ссылке
try { navigator.sendBeacon(url); return; } catch (e) { }
}
var xhr = new XMLHttpRequest();
xhr.open('GET', url, true);
xhr.send();
}
// Ссылка с картинкой: webp, запасной jpg для старых браузеров, размеры заданы — вёрстка не скачет.
function buildBanner(place, data, imageStyle) {
var link = document.createElement('a');
link.href = data.href || 'https://pomogator.ai/';
link.target = '_blank';
link.rel = 'noopener noreferrer';
link.onclick = function () { track(place, data, 'click'); };
var img = document.createElement('img');
img.src = data.src;
img.alt = ALT;
if (data.width && data.height) { img.width = data.width; img.height = data.height; }
img.setAttribute('decoding', 'async');
img.style.cssText = imageStyle;
if (data.webp) {
var picture = document.createElement('picture');
var source = document.createElement('source');
source.type = 'image/webp';
source.srcset = data.webp;
picture.appendChild(source);
picture.appendChild(img);
link.appendChild(picture);
} else {
link.appendChild(img);
}
return link;
}
function fillInline(el, place) {
if (el.getAttribute('data-ad-state')) return;
el.setAttribute('data-ad-state', 'loading');
request(ENDPOINT + '?place=' + encodeURIComponent(place), function (data) {
if (!data) { el.removeAttribute('data-ad-state'); return; }
var link = buildBanner(place, data, 'max-width:100%;height:auto;display:block;margin:0 auto;');
el.innerHTML = '';
el.appendChild(link);
el.setAttribute('data-ad-state', 'loaded');
});
}
var observer = null;
if (window.IntersectionObserver) {
observer = new IntersectionObserver(function (entries) {
for (var i = 0; i < entries.length; i++) {
if (entries[i].isIntersecting) {
var el = entries[i].target;
observer.unobserve(el);
fillInline(el, el.getAttribute('data-ad-place'));
}
}
}, { rootMargin: '150px 0px' });
}
// Блок, скрытый под текущую ширину экрана (у сайта разная вёрстка для телефона и компьютера),
// за показ не считается — иначе половина показов была бы выдуманной.
function isShown(el) {
return el.offsetParent !== null;
}
function scanInline() {
var desktop = isDesktop();
for (var i = 0; i < INLINE_PLACES.length; i++) {
var config = INLINE_PLACES[i];
if (config.device === 'desktop' && !desktop) { continue; }
if (config.device === 'mobile' && desktop) { continue; }
var nodes = document.querySelectorAll(config.selector);
var place = config.byDevice ? config.place + (desktop ? 'desktop' : 'mobile') : config.place;
for (var j = 0; j < nodes.length; j++) {
var el = nodes[j];
if (el.getAttribute('data-ad-state')) { continue; }
if (!isShown(el)) { continue; }
el.setAttribute('data-ad-place', place);
if (observer) { observer.observe(el); } else { fillInline(el, place); }
}
}
}
var fullscreenOpened = false;
function openFullscreen() {
if (fullscreenOpened) { return; }
var place = 'pomogator_fullscreen_' + (isDesktop() ? 'desktop' : 'mobile');
request(ENDPOINT + '?place=' + encodeURIComponent(place), function (data) {
if (!data || fullscreenOpened) { return; }
fullscreenOpened = true;
var htmlOverflow = document.documentElement.style.overflow;
var bodyOverflow = document.body.style.overflow;
var overlay = document.createElement('div');
overlay.setAttribute('role', 'dialog');
overlay.style.cssText = 'position:fixed;top:0;left:0;right:0;bottom:0;width:100%;height:100%;' +
'z-index:2147483645;background:' + OVERLAY_BACKGROUND + ';padding:12px;' +
'display:-webkit-box;display:-ms-flexbox;display:flex;' +
'-webkit-box-align:center;-ms-flex-align:center;align-items:center;' +
'-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;';
function close(reason) {
if (!overlay.parentNode) { return; }
overlay.parentNode.removeChild(overlay);
document.documentElement.style.overflow = htmlOverflow;
document.body.style.overflow = bodyOverflow;
document.removeEventListener('keydown', onKey);
if (reason === 'close') { track(place, data, 'close'); }
}
function onKey(e) {
if (e.key === 'Escape' || e.keyCode === 27) { close('close'); }
}
var link = buildBanner(place, data,
'display:block;max-width:100%;max-height:92vh;width:auto;height:auto;border-radius:12px;');
link.addEventListener('click', function () {
// ссылка открывается в новой вкладке, поэтому баннер убираем сразу
setTimeout(function () { close('click'); }, 50);
});
var closeBtn = document.createElement('button');
closeBtn.type = 'button';
closeBtn.setAttribute('aria-label', 'Закрыть');
closeBtn.innerHTML = '×';
closeBtn.style.cssText = 'position:absolute;top:10px;right:12px;width:44px;height:44px;' +
'line-height:38px;font-size:30px;color:#fff;background:rgba(255,255,255,.18);' +
'border:0;border-radius:50%;cursor:pointer;padding:0;';
closeBtn.onclick = function (e) {
e.preventDefault();
e.stopPropagation();
close('close');
};
overlay.appendChild(link);
overlay.appendChild(closeBtn);
overlay.addEventListener('click', function (e) {
if (e.target === overlay) { close('close'); }
});
document.documentElement.style.overflow = 'hidden';
document.body.style.overflow = 'hidden';
document.body.appendChild(overlay);
document.addEventListener('keydown', onKey);
});
}
function start() {
scanInline();
setTimeout(openFullscreen, POPUP_DELAY_MS);
var resizeTimer = null;
window.addEventListener('resize', function () {
clearTimeout(resizeTimer);
resizeTimer = setTimeout(scanInline, 300); // повернули экран — стали видны другие блоки
});
}
if (document.readyState === 'loading') {
document.addEventListener('DOMContentLoaded', start);
} else {
start();
}
})();
</script>
</body>
</html>
Объяснение:
Процидурно ориентированнай
Не бей я 5 класс