slider

Задача 1. Слайдер

В рамках домашнего задания к лекции «JavaScript в браузере: создаем интерактивные веб-страницы»

Описание

На странице товара в каталоге необходимо реализовать слайдер, в котором пять фотографий будут показываться последовательно одна за другой, с первой до последней, и потом опять с первой по кругу:

Интерфейс

Фотографии должны показываться в теге <img src="./i/spinner.gif" alt="" id="slider">. Каждая фотография демонстрируется 5 секунд. И потом сменяется на следующую.

Материалы

Фотографии для слайдера

1. Фото 1 airmax-jump.png;

2. Фото 2 airmax-on-foot.png;

3. Фото 3 airmax-playground.png;

4. Фото 4 airmax-top-view.png;

5. Фото 5 airmax.png.

Реализация

В песочнице CODEPEN

В онлайн-песочнице на CODEPEN.

Локально с использованием git

В репозитории на GitHub.

Инструкция по выполнению домашнего задания

В онлайн-песочнице

Потребуется только ваш браузер.

1. Открыть код в песочнице.
2. Нажать кнопку «Fork».
3. Выполнить задание.
4. Нажать кнопку «Save».
5. Скопировать адрес страницы, открытой в браузере.
6. Прислать скопированную ссылку через личный кабинет на сайте netology.ru.

Локально

Потребуются: браузер, редактор кода, система контроля версий git, установленная локально, и аккаунт на GitHub или BitBucket.

1. Клонировать репозиторий с домашними заданиями git clone https://github.com/netology-code/hj-homeworks.git.
2. Перейти в папку задания cd hj-homeworks/browser/slider.
3. Выполнить задание.
4. Создать репозиторий на GitHub или BitBucket.
5. Добавить репозиторий в проект git remote add homeworks %repo-url%, где %repo-url% — адрес созданного репозитория.
6. Опубликовать код в репозиторий homeworks с помощью команды git push -u homeworks master.
7. Прислать ссылку на репозиторий через личный кабинет на сайте netology.ru.