Эффекты при наведении.

В сегодняшнем уроке мы научимся создавать интересный эффект при наведении на примере блока-портфолио. При наведении на картинку с фотографией появляется внутренний темный блок, который заполняет все пространство картинки. В этом блоке есть два текста и кнопка в виде иконки.



Видео урок здесь
Читать дальше
31 мая 2017, 08:17    Юлия Обучающий раздел 0    12    0 0

Немного про композицию и видео.

В этом уроке мы создадим область сайта, в основе композиции которой, лежат два пересекающихся блока. Заголовок области состоит из 2 текстов, накладывающихся один на другой. Заголовок находится сбоку и повернут на 90 градусов.

При нажатии на кнопку блока появляется всплывающее окно которое содержит в себе видеоролик, размещённой на Youtube.



Видеоурок здесь
Читать дальше
25 мая 2017, 09:32    Юлия Обучающий раздел 0    4    0 0

Редактор PIXLI. Создаём страничку по-быстрому.

В этом уроке мы создадим простую страницу. Она разделена на несколько областей, каждая из которых содержит фиксированное изображение, что создает интересный эффект при скролле страницы. Здесь есть простые эффекты анимации навигационная панель, футер с картой.

На мобильных видах меню приобретает свернутый вид. Чтобы создать такую страницу, потребуется около 15 минут.



Ссылка на видеоурок здесь
Читать дальше
16 мая 2017, 20:14    Юлия Обучающий раздел 0    12    0 0

Эффект первого окна

В этом уроке мы создадим первое окно сайта с интересными эффектами. При загрузке страницы плавно появляется белая обводка окна. По прошествии некоторого времени окно само закрывается и проматывает открытую страницу к следующей области.
Когда пользователь прокручивает страницу вверх, окно снова плавно появляется.



Видеоурок здесь
Читать дальше
15 мая 2017, 09:53    Юлия Обучающий раздел 0    5    0 0

Создадим меню сайта. Используем анимацию.

В сегодняшнем уроке мы создадим меню сайта. Меню расположено справа и зафиксировано. Оно плавно выезжает при загрузке страницы, кнопки меню также плавно проявляются. При наведении курсора текст кнопок меняет цвет. При уменьшении размеров экрана меню приобретает свернутый вид.



Видеоурок здесь
Читать дальше
03 мая 2017, 11:29    Юлия Обучающий раздел 1    9    0 +1

Необычное использование виджета "Табы"

В этом уроке мы создадим блок, описывающий достижения компании. Информация в этом блоке разбита по годам. При наведении на кнопку с описанием года она приобретает желтый цвет. При нажатии на кнопку содержимое блока меняется. Этот блок сайта реализован с помощью виджета табы.

На Большом мониторе и планшете вид блока одинаковый. А на горизонтальном и вертикальном смартфоне порядок кнопок имеет другой вид. Кроме этого исчезает картинка, иллюстрирующая текст в блоке.


Ссылка на видео урок здесь
Читать дальше
24 апреля 2017, 18:28    Юлия Обучающий раздел 1    3    0 0

Навигация на сайте с левой стороны

В этом уроке мы создадим меню сайта. В нём есть интересные эффекты при наведении. На большом мониторе панель располагается слева и уменьшается в зависимости от размера экрана. На планшете панель располагается сверху. На горизонтальном и вертикальном смартфоне панель принимает свернутый вид и располагается в верхнем правом углу. На всех размерах сохраняются эффекты при наведении на кнопках навигационной панели.


Ссылка на видеоурок здесь
Читать дальше
19 апреля 2017, 13:45    Юлия Обучающий раздел 1    7    0 0

Позиционирование фона элементов.

В этом уроке мы создадим блок с прайсом на услуги компании. Особое внимание уделим позиционированию фона.



Ссылка на видеоурок здесь
Читать дальше
12 апреля 2017, 06:05    Юлия Обучающий раздел 1    3    0 0

Создадим блок с историей компании

В этом уроке мы научимся делать простую маленькую фишку на сайте.



Ссылка на видео урок >>
Читать дальше
05 апреля 2017, 21:18    Юлия Обучающий раздел 1    3    0 0

Создадим карту на сайте и форму обратной связи.

В этом уроке мы научимся пользоваться виджетом «карта» и формой обратной связи


Ссылка на видеоурок
Читать дальше
28 марта 2017, 08:39    Юлия Обучающий раздел 1    8    0 0