-
Подсчет введенных символов с помощью Jquery
Автор/Переводчик adminВ этом уроке я хочу вам показать пример реализации задачи подсчета символов в текстовом поле ввода с помощью JQuery. Для этого нам понадобится всего лишь несколько строчек кода сценария JavaScript . Используя данную функцию вы улучшите функционал своего сайта. Код Javascript. $(’#contentbox’).keyup(function(){}...
Создан: 27.08.2010
-
Как разместить элементы по горизонтали используя CSS
Автор/Переводчик adminВ этом уроке я хочу рассказать о горизонтальном размещении элементов в пределах основного контейнера, используя только CSS. Эта задача не особенно сложна и может быть решена, с помощью селектора CSS:first-child. На рисунке ниже приведен пример горизонтального размещения: Вот HTML код,...
Создан: 26.08.2010
-
Меню аккордеон на основе JQuery
Автор/Переводчик adminВ этом уроке хочу продемонстрировать вам меню в стиле аккордеон. Среди основных преимуществ данного меню можно выделить следующие: Вложенность аккордеонов. Возможность вложить один аккордеон в другой. Многофункциональность вложенных элементов меню. Гибкость настройки отображаемых...
Создан: 25.08.2010
-
Создание анимационного меню с помощью CSS и jQuery
Автор/Переводчик adminЭффекты анимации являются прекрасным дополнением к навигации что улучшает взаимодействие с веб-сайтом. Хотя с применением Adobe Flash все было бы намного оживленнее, но мы воспользуемся всей мощью JavaScript, тем самым избежим использование Flash в целом. Итак, сегодня мы собираемся создать...
Создан: 20.08.2010
-
Меню с эффектом масштабирования
Автор/Переводчик adminСоздать меню с эффектом масштабирования, используя чистый CSS, вдохновила меня операционная система Mac OSX. Как работает данное меню? Меню основано на линейном расположении активных элементов. Значки меню реагируют на наведение курсора мыши, увеличиваясь в размере, становясь...
Создан: 18.08.2010
-
Слайд-шоу с эффектом жалюзи
Автор/Переводчик adminЭтот скрипт был представлен Питером Джехригом на сайте www.fabulant.com. Исходный скрипт находиться по адресу: http://www.fabulant.com/downloadcenter/imglamellar3/imglamellar3.html. Конфигурация. Массив изображений. Чтобы использовать этот скрипт, Вы должны создать массив, содержащий изображения с заголовками,...
Создан: 10.08.2010
-
Трансформация ссылок с помощью CSS
Автор/Переводчик adminНедавно я посетил сайт разработчика MooTools Developer Кристофа Пойэра и увидел интересный эффект. А именно, при наведении курсора мыши на ссылку она трансформируется со смещением влево или вправо. Для усиления эффекта, цвет фона ссылки можно изменять. Данный трюк реализуется только...
Создан: 09.08.2010
-
Создание сайта с автоматической прокруткой
Автор/Переводчик adminДобрый вечер всем, сегодня мы будем погружаться в JQuery. То, что мы будем создавать, представляет собой небольшой сайт, благодаря меню которого, при нажатии, мы будем перемещаться к нужному нам разделу. Итак начнем … Нарезка изображений из готовых файлов PSD. Прежде чем мы начнем,...
Создан: 07.08.2010
-
3D эффект текстовой башни
Автор/Переводчик adminВы видели сайт Дэвида Десэндро? В его футере присутствует очень интересный эффект: Данная техника довольно проста. Давайте посмотрим. Множество текстовых теней Главную ключевую роль данного эффекта играет свойство CSS3 – text-shadow. Обычно это выглядит так: .shadow { text-shadow: 2px 2px 4px...
Создан: 20.04.2010
-
Позиционирование в CSS
Автор/Переводчик adminКогда люди мало знакомы с основами CSS, проявляется тенденция стремления к позиционированию. Позиционирование кажется на первый взгляд простым. Вы определяете, где точно должен быть расположен блочный элемент. Но все не так просто, как, кажется на первый взгляд. Есть несколько...
Создан: 19.04.2010
-
Декларация !important в CSS
Автор/Переводчик adminДекларация !important была валидна начиная с CSS1, но она, похоже, приобрела плохую репутацию за эти годы. Хотя если ее использовать с осторожностью, то это будет полезным и мощным инструментом, который заслуживает свое место в мире CSS. Данная статья предлагает руководство по тому,...
Создан: 09.04.2010
-
Всё о свойстве float
Автор/Переводчик adminЧто такое “float”? Float в CSS является свойством позиционирования. Для того чтобы понять его цели и происхождение, можно сравнить его с полиграфическим дизайном. При подготовке к печати изображения позиционируют так, чтобы текст как бы обтекал их по мере необходимости. Обычно...
Создан: 25.03.2010
-
Создание мозаичного слайд-шоу с помощью jQuery и CSS
Автор/Переводчик adminПри проектировании веб-страниц очень часто приходится сталкиваться с необходимостью вывода изображений в определенной последовательности, такой как слайд-шоу. С расширением библиотеки Jquery и ее многочисленных плагинов открывается изобилие готовых решений, для решения...
Создан: 19.03.2010
-
CSS3 выпадающее меню
Автор/Переводчик adminВ этом уроке мы рассмотрим способ создания многоуровневого выпадающего меню в стиле Mac. Для создания меню я использовал следующие CSS3 свойства – border-radius, box-shadow и text-shadow. Данное меню прекрасно отображается в Firefox, Safari и Chrome. В остальных браузерах, не поддерживающих CSS3 таких как...
Создан: 14.03.2010
-
Центрирование div по горизонтали и вертикали
Автор/Переводчик adminПри создании макетов веб-страниц, вы наверняка сталкивались с ситуацией, когда вам необходимо центрировать блоки Div по горизонтали и вертикали, обходясь только средствами CSS. Есть более, чем несколько путей для достижения этой цели, и в этом коротком уроке я покажу вам мою любимую...
Создан: 14.03.2010
-
Блочная модель в CSS
Автор/Переводчик adminКаждый элемент веб-дизайна представляет собой прямоугольный блок. Понимание основ блочной модели в CSS есть залог правильной верстки. В этом уроке мы рассмотрим структуру блочного элемента, а также его особенности отображения в различных браузерах. Для начала рассмотрим как...
Создан: 13.03.2010
-
Стильный список с помощью одного пикселя
Автор/Переводчик adminОднопиксельное фоновое изображение может быть достаточно универсальным в применении. С помощью repeat-x оно может стать горизонтальной линией, с помощью repeat-y – вертикальной, repeat – полностью заполнить страницу одним цветом. Кроме того, его можно использовать для стилизации...
Создан: 18.02.2010
-
Создание двойных кавычек
Автор/Переводчик adminВ этом уроке мы рассмотрим способ создания двойных кавычек, при помощи тега <blockquote>. Способ заключается в применении двух фоновых изображений, одно из которых применяется к тегу <blockquote>, другое к псевдо-элементу first-letter. 1. Исходный код HTML Начнем с тега <blockquote>, предварительно...
Создан: 17.02.2010
-
Дизайн меню с использованием CSS
Автор/Переводчик adminВ этом уроке Вы познакомитесь с процессом создания списка меню, используя стиль рамки или фоновое изображение. Весь фокус заключается в применении нижней границы к тегу <li> и абсолютного позиционирования всех вложенных элементов со смещением вниз. Вы с легкостью можете...
Создан: 16.02.2010
-
Создание двойного фонового эффекта с помощью CSS
Автор/Переводчик adminОбычно при создании эффекта растягиваемого фона с помощью CSS, мы используем изображение фиксированного размера и повторяем его по оси Х, пока не заполнится вся страница. Конечно, для того чтобы достигнуть такого результата, верхняя часть сайта (header) должна быть центрирована,...
Создан: 15.02.2010
