Build Cool CSS Анімації Легко з Animista
Існує тонн веб-додатків анімації CSS в Інтернеті. Але, дуже мало хто порівнюють з рівнем деталізації і простотою використання, яку ви отримуєте Animista.
Цей безкоштовний веб-додаток дозволяє створювати власні анімації CSS одним натисненням кнопки. Ви вибираєте між заздалегідь розробленими рухами, такими як слайди, перетворення, гойдалки і навіть анімації падіння тіней.
Після створення анімації ви можете експортувати код подібно до інших генераторів CSS. За винятком, цей код набагато простіше працювати і навіть поставляється з вбудованим інструментом міні-програвача.
Інтерфейс спочатку може бути заплутаним, але це тільки тому, скільки опцій у вас є!
Ви створюєте власні анімації наступних трьох основних кроків і використання інтерфейсу зверху вниз:
- Виберіть стиль руху (розмах, слайд, фліп-масштаб) з кіл у верхній частині
- Налаштуйте його різними типами рухів під ним
- Редагуйте параметри анімації на плаваючій панелі параметрів ліворуч
Через цей процес можна змінити загальну тривалість анімації, стиль ослаблення, затримку, майже все. І це все працює через чистий CSS3, що робить його ще більш вражаючим.
Також зверніть увагу, що на самій верхній навігаційній панелі можна навіть вибрати різні типи стилів анімації.
The за замовчуванням “основний” які можуть працювати майже на будь-що (наведіть курсор, клацніть або негайно анімацію). Інші цілі включають текст сторінки, фонові анімації та навіть анімації вхідних даних щоб відобразити прихований елемент сторінки.
Особливо мені подобається “уваги” посилання у верхній частині, яка має деякі цікаві ефекти тремтіння і джиттера для стилів кнопок. Вони чудово працюють на кнопках CTA, щоб привернути увагу та заохотити взаємодію користувачів.
Як тільки ви зробите коригування, ви просто натисніть значок маленької дужки у верхньому правому куті області попереднього перегляду.
Це призводить до перегляду нової сторінки Ваш повний клас анімації CSS, разом з ключовими кадрами. Додаткові функції дозволяють зменшити код і включають автоматичний префікс яка підтримує старі веб-браузери.
Я використав тонн користувальницьких інструментів анімації CSS і, без сумніву, Animista є найбільш багатофункціональним інструментом там. Це абсолютно безкоштовно і трохи складне на перший погляд, але як тільки ви зрозумієте інтерфейс, це, безумовно, найкращий генератор, який можна використовувати.
Щоб спробувати, просто відвідайте домашню сторінку та натисніть “Спробуй мене”. Ви також можете поділитися своїми думками та компліментами з творцем веб-програми @ ana108.
