Як зробити анімовану кнопку
Оформлення сайтів дуже важливо для того, як їх в підсумку сприймають відвідувачі. Люди повинні відчувати естетичне задоволення, перебуваючи на сторінках сайту, а також ці сторінки повинні бути для них зручними і функціональними. Жоден сайт не обходиться без навігаційних кнопок, і ваш сайт буде виглядати одночасно функціональним і красивим, якщо ви зробите ці кнопки анімованими.
1
Графічні кнопки, на відміну від текстових, помітні на сторінках і легко запам`ятовуються читачами. Для створення анімованих кнопок скористайтеся програмою Corel Draw. Створіть новий документ і намалюйте заготовку, на якій кнопка буде зображена в декількох видах, як в натиснутому, так і в не натисканням стані.
2
Для того щоб намалювати кнопку, виберіть відповідний інструмент на панелі інструментів і намалюйте прямокутник із закругленими краями. Залийте прямокутник чорним кольором, а потім скопіюйте його і посуньте вліво і вгору копію. Залийте другий прямокутник білим кольором.
3
На заготівлі кнопки напишіть її назву, додавши до тексту чорний контур. Сам текст зробіть білим. Тепер відкрийте меню Effects Rollover, виділивши кнопку і клікніть на опцію Create Rollover. У рядку стану Rollover ви побачите напис Normal.
4
Тепер, щоб змінити малюнок кнопки, клікніть на неї правою клавішею миші і в контекстному меню виберіть опцію Edit Rollover. Відкриється нова панель інструментів Internet. Намалюйте додаткові положення кнопки, які потім будуть змінюватися один за одним, створюючи ефект анімації.
5
У лівій частині панелі Internet клікніть на кнопку Over і відредагуйте кнопку, видаливши контур тексту. Залийте текст чорним кольором, щоб створити її другий варіант в анімації. Тепер натисніть кнопку Down і намалюйте останній варіант кнопки в натиснутому стані.
6
Посуньте текст і білий прямокутник вниз вправо, а чорний прямокутник посуньте вгору вліво. Тепер натисніть на кнопку Finish Editing Rollover.
7
Збережіть кнопку разом з кодом, за допомогою якого ви зможете змінювати зовнішній вигляд об`єктів на веб-сторінці. Таким способом, ви зможете намалювати кнопку будь-якого виду з будь-яким оформленням.
Статті за темою "Як зробити анімовану кнопку"
Оцініть, будь ласка статтю