Skip to content

Module2 task1 Подключает functions.js #4

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
dchirkova11-glitch wants to merge 2 commits into
base: master
Choose a base branch
from
Open

Module2 task1 Подключает functions.js #4

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
72e18ab
Подключает functions.js
dchirkova11-glitch Jun 25, 2026
6560ad4
Merge branch 'htmlacademy-javascript:master' into module2-task1
dchirkova11-glitch Jun 27, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
65 changes: 41 additions & 24 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
<!DOCTYPE html>
<html lang="ru">

<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
Expand All @@ -16,7 +17,8 @@
<section class="img-filters img-filters--inactive container">
<h2 class="img-filters__title visually-hidden">Фильтр фотографий</h2>
<form class="img-filters__form" action="index.html" method="get" autocomplete="off">
<button type=button class="img-filters__button img-filters__button--active" id="filter-default">По умолчанию</button>
<button type=button class="img-filters__button img-filters__button--active" id="filter-default">По
умолчанию</button>
<button type=button class="img-filters__button" id="filter-random">Случайные</button>
<button type=button class="img-filters__button" id="filter-discussed">Обсуждаемые</button>
</form>
Expand Down Expand Up @@ -46,7 +48,8 @@ <h2 class="img-upload__title visually-hidden">Загрузка фотограф
<!-- Изменение размера изображения -->
<fieldset class="img-upload__scale scale">
<button type="button" class="scale__control scale__control--smaller">Уменьшить</button>
<input type="text" class="scale__control scale__control--value" value="100%" title="Image Scale" name="scale" readonly>
<input type="text" class="scale__control scale__control--value" value="100%" title="Image Scale"
name="scale" readonly>
<button type="button" class="scale__control scale__control--bigger">Увеличить</button>
</fieldset>

Expand All @@ -69,42 +72,48 @@ <h2 class="img-upload__title visually-hidden">Загрузка фотограф
<fieldset class="img-upload__effects effects">
<ul class="effects__list">
<li class="effects__item">
<input type="radio" class="effects__radio visually-hidden" name="effect" id="effect-none" value="none" checked>
<input type="radio" class="effects__radio visually-hidden" name="effect" id="effect-none"
value="none" checked>
<label for="effect-none" class="effects__label">
<span class="effects__preview effects__preview--none">Превью фото без эффекта</span>
Оригинал
</label>
</li>
<li class="effects__item">
<input type="radio" class="effects__radio visually-hidden" name="effect" id="effect-chrome" value="chrome">
<input type="radio" class="effects__radio visually-hidden" name="effect" id="effect-chrome"
value="chrome">
<label for="effect-chrome" class="effects__label">
<span class="effects__preview effects__preview--chrome">Превью эффекта Хром</span>
Хром
</label>
</li>
<li class="effects__item">
<input type="radio" class="effects__radio visually-hidden" name="effect" id="effect-sepia" value="sepia">
<input type="radio" class="effects__radio visually-hidden" name="effect" id="effect-sepia"
value="sepia">
<label for="effect-sepia" class="effects__label">
<span class="effects__preview effects__preview--sepia">Превью эффекта Сепия</span>
Сепия
</label>
</li>
<li class="effects__item">
<input type="radio" class="effects__radio visually-hidden" name="effect" id="effect-marvin" value="marvin">
<input type="radio" class="effects__radio visually-hidden" name="effect" id="effect-marvin"
value="marvin">
<label for="effect-marvin" class="effects__label">
<span class="effects__preview effects__preview--marvin">Превью эффекта Марвин</span>
Марвин
</label>
</li>
<li class="effects__item">
<input type="radio" class="effects__radio visually-hidden" name="effect" id="effect-phobos" value="phobos">
<input type="radio" class="effects__radio visually-hidden" name="effect" id="effect-phobos"
value="phobos">
<label for="effect-phobos" class="effects__label">
<span class="effects__preview effects__preview--phobos">Превью эффекта Фобос</span>
Фобос
</label>
</li>
<li class="effects__item">
<input type="radio" class="effects__radio visually-hidden" name="effect" id="effect-heat" value="heat">
<input type="radio" class="effects__radio visually-hidden" name="effect" id="effect-heat"
value="heat">
<label for="effect-heat" class="effects__label">
<span class="effects__preview effects__preview--heat">Превью эффекта Зной</span>
Зной
Expand Down Expand Up @@ -154,15 +163,18 @@ <h2 class="big-picture__title visually-hidden">Просмотр фотогра
</div>

<!-- Комментарии к изображению -->
<div class="social__comment-count"><span class="social__comment-shown-count">5</span> из <span class="social__comment-total-count">125</span> комментариев</div>
<div class="social__comment-count"><span class="social__comment-shown-count">5</span> из <span
class="social__comment-total-count">125</span> комментариев</div>
<ul class="social__comments">
<li class="social__comment">
<img class="social__picture" src="img/avatar-4.svg" alt="Аватар комментатора фотографии" width="35" height="35">
<img class="social__picture" src="img/avatar-4.svg" alt="Аватар комментатора фотографии" width="35"
height="35">
<p class="social__text">Мега фото! Просто обалдеть. Как вам так удалось?</p>
</li>
<li class="social__comment">
<img class="social__picture" src="img/avatar-3.svg" alt="Аватар комментатора фотографии" width="35" height="35">
<p class="social__text">Да это фоташоп!!!!!!!!</p>
<img class="social__picture" src="img/avatar-3.svg" alt="Аватар комментатора фотографии" width="35"
height="35">
<p class="social__text">Да это фоташоп!!!!!!!!</p>
</li>
</ul>

Expand All @@ -171,7 +183,8 @@ <h2 class="big-picture__title visually-hidden">Просмотр фотогра

<!-- Форма для отправки комментария -->
<div class="social__footer">
<img class="social__picture" src="img/avatar-6.svg" alt="Аватар комментатора фотографии" width="35" height="35">
<img class="social__picture" src="img/avatar-6.svg" alt="Аватар комментатора фотографии" width="35"
height="35">
<input type="text" class="social__footer-text" placeholder="Ваш комментарий...">
<button type="button" class="social__footer-btn" name="button">Отправить</button>
</div>
Expand All @@ -186,11 +199,14 @@ <h2 class="big-picture__title visually-hidden">Просмотр фотогра
<footer class="page-footer container">
<div class="page-footer__wrapper">
<div class="page-footer__copyright copyright">
<a class="copyright__link copyright__link--image" href="https://htmlacademy.ru/intensive/javascript"><img src="img/htmla-logo.svg" width="130" height="45" alt="HTML Academy"></a>
<p>Сделано в <a class="copyright__link copyright__link--text" href="https://htmlacademy.ru/intensive/javascript">HTML Academy</a></p>
<a class="copyright__link copyright__link--image" href="https://htmlacademy.ru/intensive/javascript"><img
src="img/htmla-logo.svg" width="130" height="45" alt="HTML Academy"></a>
<p>Сделано в <a class="copyright__link copyright__link--text"
href="https://htmlacademy.ru/intensive/javascript">HTML Academy</a></p>
</div>
<ul class="page-footer__contacts contacts">
<li><a href="https://twitter.com/htmlacademy_ru" class="contacts__link contacts__link--twitter">Twitter</a></li>
<li><a href="https://twitter.com/htmlacademy_ru" class="contacts__link contacts__link--twitter">Twitter</a>
</li>
<li><a href="https://vk.com/htmlacademy" class="contacts__link contacts__link--vk">VK</a></li>
</ul>
</div>
Expand Down Expand Up @@ -227,12 +243,13 @@ <h2 class="success__title">Изображение успешно загруже
</section>
</template>

<!-- Сообщение с ошибкой загрузки изображений от других пользователей -->
<template id="data-error">
<section class="data-error">
<h2 class="data-error__title">Не удалось загрузить данные</h2>
</section>
</template>

<!-- Сообщение с ошибкой загрузки изображений от других пользователей -->
<template id="data-error">
<section class="data-error">
<h2 class="data-error__title">Не удалось загрузить данные</h2>
</section>
</template>
<script src="./js/functions.js"></script>
</body>
</html>

</html>
Loading