Глитч текста

14 июня 2016 Антон Кулешов 2507 0

Как-то я уже писал статью по глитчу – как оказалось, тема очень востребована, поэтому я написал, ко всему, и свой собственный онлайн глитч генератор на JavaScript, который вы можете наблюдать во вкладке сервисов. В будущем, скорее всего я его переделаю и улучшу, а сегодня я решил добавить ещё один способ реализации глитч эффекта. Данный вариант я давно хотел отобразить у себя на сайте, так как в нем используются только HTML и CSS3.

Реклама

Задумка реализации глитча через CSS3 проста, но написание кода с нуля может занять массу времени, поэтому я и решил добавить готовый вариант. Его я нашел на одном англоязычном сайте - css-tricks, там полностью расписывается механизм создания эффекта, используя возможности CSS3. Советую прочитать - очень интересная статья. На странице демо находится сам результат и, как можно заметить, выглядит весьма и весьма годно. Для глитча подключаем стили:

<link href="glitch.css" type="text/css" rel="stylesheet" />

Далее добавляем на HTML страницу разметку:

<div class="glitch" data-text="falbar">falbar</div>

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

Реклама
Комментариев еще не оставлено
no_avatar
Читайте далее

Будильник на компьютер – встаём однозначно

28 июня 2015 ti1schweiger

Лето! Для кого-то разгар отдыха и отпусков, а для кого-то рабочее пекло трудовой шестидневки, так как «сезон» и прибыль надо грести лопатой, пока это возможно. Вот и приходится вкалывать от зари до зари, а от вечерних посиделок в компании друзей тоже отказываться не хочется. В итоге – явный недосып и огромные проблемы с утренним подъёмом, благо, когда он не похмельный. Проспав, таким образом, пару очень важных встреч: первую по вине китайского будильника, который двумя часами позже улетел в стену, а вторую, уже по вине телефона с севшей батареей, видите ли, андроиду очень важно было обновиться ночью и что-то там найти в интернете, я серьезно задумался над поиском надежного утреннего будильника.

Как определить пользователя, зашедшего с телефона

3 октября 2014 Антон Кулешов

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

О том, как я не очень «легко» коротал вечер в компании приложений Facebook

14 января 2016 Антон Кулешов

Миром овладели соцсети, а потому, мало кто станет регистрироваться на сайте или форуме, заполняя при этом кучу полей, добавляя аватарку и прочее. Дабы привлечь посетителей нам придется использовать API социальных сетей – где уже есть вся нужная нам информация для оформления профиля. Ранее мы уже рассматривали один из способов авторизации пользователя через «ВКонтакте», сегодня поговорим о Facebook.