Одна из типичных задач для улучшения пользовательского интерфейса на сайтах — это визуализация ожидания загрузки/обновления страницы. Наиболее частый случай — это обновление части шаблона, используя ajax. В конце рассмотрим дополнительно менее распространенный случай — визуализацию в контейнере при ожидании загрузки картинки браузером.
Все записи категории ‘Танцы с CSS’
23 Окт, 2015
В последнее время как то кучно пошло у меня использование CCS3 анимации. Продолжаю делиться шаблонами. Сегодня рассмотрим анимацию, которая, запускаясь при наведении, имитирует дрожание элемента. Её можно подключать и в других случаях (не только при наведении). Например, с помощью подключения класса (css), который описывает эффект, или установить как анимацию HTML элемента по умолчанию. Всё в ваших руках, я покажу лишь пример.
21 Окт, 2015
Давайте рассмотрим, как сделать эффект небольшого увеличения картинки при наведении курсора на контейнер. Такой эффект может немного оживить страницу, добавить динамики. Я не буду использовать скрипты, эффект работает на CSS3.
Читать далее »
19 Окт, 2015
Очень простая мулька, но выглядит при соответствующем фоне потрясающе. Сделаем так, чтобы при скроллинге страницы, фон двигался вдвое медленнее, создавая что то вроде эффекта параллакса.
19 Сен, 2015
Пока Хром не поддерживает данное значение атрибута спецификации CSS, что то надо делать!
17 Сен, 2015
Центровка элемента — одна из типовых задач в верстке. Решать её можно по разному, рассмотрим некоторые способы.
16 Сен, 2015
Сейчас очень модными стали адаптивные версии дизайна, которые умеют подстраиваются под размер экрана устройства, на котором открыли сайт. Столбцы (сайдбары, основной контент и т.п.) можно сделать адаптивной ширины, менять их положение, скрывать при достижении определенных размеров. Как быть с картинками, которые всегда имеют конкретный фактический размер?
14 Сен, 2015
Много занимаюсь версткой, потому возникают разные интересные задачи. Решил не оставлять без внимания этот интересный опыт.
Одна из таких задач, которая нередко возникают при верстке сайтов, желание заказчика «прибить» футер шаблона к нижнему краю окна браузера. Иначе, когда на странице мало контента, нижняя часть шаблона (футер) болтается как одна субстанция в проруби.
Дальше я показываю целых три способа как разместить футер у нижнего края экрана.