Lecaw

Учимся создавать Web-сайты

CSS

Большинство статей в этой категории основаны на CSS3. CSS3 - следующий шаг в развитии каскадных таблиц стилей. Он много нам обещает и, судя по всему, действительно будет прорывом для веб-дизайна. Если, конечно, опять не подкачают разработчики браузеров.

Сегодня я хотел бы поговорить о видео. В прошлый раз мы говорили про YouTube, но сегодня я решил выбрать Vimeo. Видео обычно означает, что должно быть много места на жестком диске хостинг-аккаунта. И это правда, в случае если вы храните видеофайлы на собственном сервере. Но, можно легко избежать этих трудностей (видео хранение и преобразование) – также можно попытаться работать через видео хостинг. Наш второй пример – Vimeo. В этом учебном руководстве я расскажу, как можно создать загрузчик Vimeo для веб-сайта.

В данном уроке представлен вариант создания динамического индикатора процесса на CSS3. Никаких изображений не используется (кроме фона для демонстрации). Представлены три варианта.

Нет простого и стандартного способа разместить текст по кругу (или по другой кривой). Но задачу можно решить! В данном уроке будет описан один из способов. Однако, для решения будет использоваться CSS3 и JavaScript и в старых браузерах поддерживаться не будет. Если вам нужно обеспечивать обратную совместимость, то лучше воспользоваться изображениями с текстом в атрибуте alt (или отслеживать поддержку и включать описанный метод в современных браузерах).

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

В данном уроке мы создадим книжку с пробниками с помощью трансформаций вращения CSS и JavaScript. Будет формироваться структура, похожая на набор пробников, в которой панели воспринимают нажатия кнопки мыши, после чего происходит открытие нужной страницы.

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