Отправляет email-рассылки с помощью сервиса Sendsay
  Все выпуски  

Выпуск 7


Количество подписчиков: 35

Выпуск 7 - Движение клавишами. Селекторы CSS

Здравствуйте, дорогие читатели!

Прежде всего хочу сделать объявление.

Я провожу бесплатные консультации по дизайну, юзабилити и содержимому вашего сайта!

Так что если вам необходимо да и просто интересно узнать мнение независимого эксперта, присылайте мне заявки на имейл natalia.macheda at gmail.com или в блог рассылки


Передвижение элементов при помощи клавиатуры

Напоминаю, что в выпуске Реакция на клавиатуру, я показала базовые функции перехвата нажатий клавиш клавиатуры. Сейчас мы рассмотрим, как можно активизировать движение элементов при помощи клавиатуры. Идея проста: вы перехватываете нажатие какой-то клавиши и для неё вызываете соответствующий обработчик. В следующем фрагменте кода мы реализуем эту идею на примере клавиши "А", которая в Internet Explorer'е имеет код (ieKey) 65, а в Netscape (nKey) 97 соответственно.

function init() {
 if (ns4) block = document.blockDiv
 if (ie4) block = blockDiv.style
 block.xpos = parseInt(block.left)

 document.onkeydown = keyDown
 if (ns4) document.captureEvents(Event.KEYDOWN)
}

function keyDown(e) {
 if (ns4) {var nKey=e.which; var ieKey=0}
 if (ie4) {var ieKey=event.keyCode; var nKey=0}
 if (nKey==97  ieKey==65) {   // if "A" key is pressed
  slide()
 }
}

function slide() {
 block.xpos += 5
 block.left = block.xpos
 status = block.xpos       // not needed, just for show
 setTimeout("slide()",30)
}

Пример функционирования кода

>>Читать статью полностью и обсуждать>>


Кратко о CSS селекторах

По мотивам http://msdn2.microsoft.com/en-us/library/aa358833(VS.85).aspx

Базовый строительный блок Каскадных Таблиц Стиля (Cascading Style Sheets, CSS) - это правила стиля. Селекторы используются для определения элементов HTML-страницы, к которым будет применен тот или иной стиль.

Правила стиля

Правило стиля - это выражение, которое говорит браузеру, как отображать некую группу элементов на HTML-странице. Правило содержит селектор, за которым следует блок декларации. Блок декларации - это всё, что внутри фигурных скобок ({}). Например, следующий код модифицирует стандартное отображение HTML-элемента H1

селектор  блок декларации
--------  -----------------------------
H1        { font-variant: small-caps; }
            ------------  ----------
            свойство      значение 

Как мы уже поняли ранее, декларация состоит из свойства и его значения, раздедённые между собой двоеточием (:). Пробелы в блоке декларации игнорируются, поэтому используйте их как вам нравится для форматирования CSS-файла. Множественные декларации внутри кривых скобок разделены между собой точкой с запятой (;). Хорошим тоном считается всегда завершать декларацию точкой с запятой, даже если декларация одна единственная.

>>Читать статью полностью и обсуждать>>


Бесплатные консультации

Дизайн и юзабилити

Как сделать дизайн удобным, понятным и приятным для глаз пользователя. Консультация включает в себя оценку как внешнего вида, так и кода сайта (HTML, CSS, JavaScript). Кроме того будет проведен краткий обзор содержимого сайта (картинки и сайт) на предмет его воспринимаемости и понятности, а также оптимизированности под поисковые системы.


Дружественные рассылки

Мои рассылки

Рассылки Subscribe.Ru
Java Programer&Developer
Фотобанки и микростоки для чайников
Интернет-заработок site free
CSS и DHTML для сайтостроительства
Йога для чайников

Другие рассылки

По вопросам партнёрства рассылок или их рекламы в данной рассылке и блоге рассылки пишите мне на имейл natalia.macheda at gmail.com или в блог


Если у Вас возникли вопросы, пишите мне, я с радостью на них отвечу. Прокоментировать выпуски рассылки можно и в блоге рассылки. Если Вам понравился этот выпуск, пожалуйста, проголосуйте за него. Форма голосования находится внизу письма. Если вы ставите оценку ниже 5, то я буду очень признательна, если вы напишете развёрнутое обоснование мне письмом на адрес natalia.macheda at gmail.com или в блоге рассылки

С уважением,
Наталия Македа
natalia.macheda at gmail.com
2008-02-28

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


В избранное