Css чайник 2. Превращаем css кнопку в гиф анимацию

Привет! в прошлом посте мы сделали кнопку анимированную "подписаться" с помощью css. Сегодня же я вам расскажу как теперь превратить это все в gif анимацию и вставить в пост на Golos`е.

Для записи gif нам понадобиться программа ScreenToGif (это не в коем случае не реклама, просто я пользовался этой программой, вы можете использовать любую другую программу по своему усмотрению).

скачиваем и запускаем программу, выбираем "запись" и увидим перед собой следующее:

Прозрачная область окна (на изображении это белый прямоугольник в центре окна) - это область записи.
Запустим html файл с нашей кнопкой и наведем окно записи.

Жмем на красный кружок и запись началась.

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

Здесь мы можем удалить лишние кадры.После этого в разделе "файл" выбираем "сохранить как". Сохраняем со следующими настройками, они дают более ли менее хорошее изображение и нормальные цвета.

Теперь у нас есть готовая гифка кнопки "подписаться" для вставки в ваш пост!

Программа не слишком сложная, поэтому если я что-то упустил, думаю, для ва сне будет проблемой разобраться самим :)

Подписывайтесь и голосуйте за этот пост!
CSS чайник. Делаем красивую кнопку "подписаться" в стиле Golos'а
кнопки "подписаться" для ваших постов на Golos'е