FDAPolytech · iscatell · May 17, 2025 · May 17, 2025
diff --git a/work/K3321/Язев_Григорий_Андреевич/lab5/index.html b/work/K3321/Язев_Григорий_Андреевич/lab5/index.html
@@ -0,0 +1,77 @@
+<!DOCTYPE html>
+<html lang="ru">
+<head>
+    <meta charset="UTF-8">
+    <title>Язев Г.А.</title>
+</head>
+    <link rel="stylesheet" href="style.css">
+<body>
+
+<h2></h2>
+
+<div id="image-container">
+    <img src="web_lab5.png" usemap="#image-map" alt="Карта" id="main-image">
+    <img id="png-overlay" src="экран_ненорм.png" alt="Overlay PNG">
+</div>
+
+<map name="image-map">
+    <!-- Воспроизведение аудио 1-->
+    <area shape="poly" coords="1093,649,881,652,884,451,1091,455" onclick="playAudio('sound1.mp3')" href="#">
+
+    <!-- Воспроизведение аудио 2 -->
+    <area shape="circle" coords="1261,536,125" onclick="playAudio('sound2.mp3')" href="#">
+
+    <!-- Всплывающее окно -->
+    <area shape="poly" coords="699,511,740,584,787,508" onclick="showPopup()" href="#">
+
+    <!--Отобразит PNG -->
+    <area shape="rect" coords="801,699,703,911" onclick="showPNG()" href="#">
+
+    <!--Ссылка на сайт-->
+    <area shape="rect" coords="569,28,1403,542" href="https://yandex.ru/pogoda/2?lat=59.969051&lon=30.431837&utm_source=serp&utm_campaign=helper&utm_medium=desktop&utm_content=helper_desktop_main&utm_term=title" target="_blank">
+</map>
+
+<div id="popup">Осторожно, горячо!</div>
+
+<audio id="audio-player" src=""></audio>
+
+<script>
+    let audio = document.getElementById('audio-player');   
+    let audioTimeout; 
+    function playAudio(src) {
+        audio.pause();         
+        audio.currentTime = 0; 
+        audio.src = src;
+        audio.volume = 0.25;
+        audio.play();   
+    if (audioTimeout) {
+        clearTimeout(audioTimeout);
+        }
+
+
+    audio.onplaying = () => {
+         audioTimeout = setTimeout(() => {
+            audio.pause();
+            audio.currentTime = 0;
+        }, 33000);
+    };
+
+    audio.play().catch(error => {
+        console.error("Ошибка при воспроизведении:", error);
+    });
+}
+function showPopup() {
+        const popup = document.getElementById('popup');
+        popup.style.display = 'block';
+        setTimeout(() => popup.style.display = 'none', 5000);
+    }
+
+    function showPNG() {
+        const overlay = document.getElementById('png-overlay');
+        overlay.style.display = 'block';
+        setTimeout(() => overlay.style.display = 'none', 10000);
+    }
+</script>
+
+</body>
+</html>
diff --git a/work/K3321/Язев_Григорий_Андреевич/lab5/sound1.mp3 b/work/K3321/Язев_Григорий_Андреевич/lab5/sound1.mp3
diff --git a/work/K3321/Язев_Григорий_Андреевич/lab5/sound2.mp3 b/work/K3321/Язев_Григорий_Андреевич/lab5/sound2.mp3
diff --git a/work/K3321/Язев_Григорий_Андреевич/lab5/style.css b/work/K3321/Язев_Григорий_Андреевич/lab5/style.css
@@ -0,0 +1,57 @@
+body {
+    margin: 0;
+    font-family: Arial, sans-serif;
+    background-color: #f0f0f0;
+    text-align: center;
+}
+
+h2 {
+    margin-top: 20px;
+    color: #333;
+}
+
+#image-container {
+    position: relative;
+    display: inline-block;
+    margin-top: 20px;
+}
+
+#main-image {
+    max-width: 100%;
+    height: auto;
+    border: 3px solid #aaa;
+    box-shadow: 0 0 10px rgba(0,0,0,0.3);
+}
+
+
+#popup {
+    position: absolute;
+    top: 555px; 
+    left: 1300px;
+    background-color: rgba(0, 0, 0, 0.75); 
+    padding: 14px 22px;
+    border: 3px solid #fff; 
+    border-radius: 12px;
+    box-shadow: 0 0 20px rgba(0,0,0,0.5);
+    font-size: 20px;
+    font-weight: bold;
+    color: #fff; 
+    text-shadow: 1px 1px 3px rgba(0,0,0,0.9); 
+    display: none;
+    z-index: 10;
+    max-width: 300px;
+    text-align: center;
+}
+
+
+#png-overlay {
+    position: absolute;
+    top: 357px;  
+    left: 259px;
+    width: 181px; 
+    height: auto;
+    display: none;
+    z-index: 9;
+    border: 2px solid #000;
+    box-shadow: 0 0 10px rgba(0,0,0,0.5);
+}
diff --git a/work/K3321/Язев_Григорий_Андреевич/lab5/web_lab5.png b/work/K3321/Язев_Григорий_Андреевич/lab5/web_lab5.png
diff --git a/work/K3321/Язев_Григорий_Андреевич/lab5/экран_ненорм.png b/work/K3321/Язев_Григорий_Андреевич/lab5/экран_ненорм.png
diff --git a/work/номер_группы/ФИО/номер_лабы/index.html b/work/номер_группы/ФИО/номер_лабы/index.html