Как сделать анимацию иконок на продающей странице

Анимация на лендинге

Сайты постоянно совершенствуются и количество элементов с необычными эффектами появляется всё больше. В этом плане лендинги (продающие, подписные страницы) также не отстают. Но есть эффекты, которые бы и не подумал применить на лендинге, а ведь там он будет смотреться действительно красиво. Сегодня речь и пойдет о таком элементе. Я рассказал в статье о том, как сделать анимацию иконок на продающей странице (или подписной).

Иконки появляются с эффектом рисования. Как будто кто-то их аккуратно обводит. Смотрится необычно. Всё это происходит как только страница загрузиться.

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

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

		Это интересно 0	Как всё будет выглядеть в блоге: Как сделать анимацию иконок на продающей странице Сайты постоянно совершенствуются и количество элементов с необычными эффектами появляется всё больше Скопируйте код для блога: <div style="border:1px solid #E8E8E8;margin:10px auto;padding:10px 15px;"> <a href="https://subscribe.ru/" style="display:block;"><img src="https://subscribe.ru/img/logokanal.png" style="margin:0;border: 0;" alt=""/></a> <a href="https://subscribe.ru/group/sekretyi-wordpress-daem-sovetyi/8621409/" style="border-color:#E8E8E8;border-style:solid;border-width:1px 0;color:#555555;display:block;font-family:trebuchet MS;font-size:1.2em; font-weight:bold;margin:5px 0;padding:5px 0;text-decoration:none;"> Как сделать анимацию иконок на продающей странице </a> <div class="insert-intro" style="font-family:trebuchet MS;"> Сайты постоянно совершенствуются и количество элементов с необычными эффектами появляется всё больше </div> </div> Как сделать анимацию иконок на продающей странице <div style="border:1px solid #E8E8E8;margin:10px auto;padding:10px 15px;"> <a href="https://subscribe.ru/" style="display:block;"><img src="https://subscribe.ru/img/logokanal.png" style="margin:0;border: 0;" alt=""/></a> <a href="https://subscribe.ru/group/sekretyi-wordpress-daem-sovetyi/8621409/" style="border-color:#E8E8E8;border-style:solid;border-width:1px 0;color:#555555;display:block;font-family:trebuchet MS;font-size:1.2em; font-weight:bold;margin:5px 0;padding:5px 0;text-decoration:none;">Как сделать анимацию иконок на продающей странице</a> <div style="font-family:trebuchet MS;"> Сайты постоянно совершенствуются и количество элементов с необычными эффектами появляется всё больше </div> </div>

Юрий Немец

11.06.2015

В избранное Пожаловаться Просмотров: 229

Комментарии ⁰

Секреты Wordpress. Даем советы 10323

Активные участники:

Последние откомментированные темы:

Как сделать анимацию иконок на продающей странице

Комментарии временно отключены

Открытая группа
1292 участника