Блог счастливого веб-разработчика Голосов: 1 Адрес блога: http://ridler-fun.livejournal.com/ Добавлен: 2010-12-26 16:27:55

Работа с типами данных и переменных.

2010-12-26 19:56:32 (читать в оригинале)

Сохранение отдельного фрагмента информации, например, числа или последовательности символов для переменной, - это только первый шаг в создании программы. Большинство сценариев для получения новых результатов выполняют различные операции с данными. Например, добавление к очкам определенного числа для увеличения их количества в процессе игры; умножение количества заказанных товаров на их стоимость; персонализация исходного сообщения путем добавления имени пользователя: "Добро пожаловать, Тёма". JavaScript предоставляет различные операторы для модификации данных. 

Оператор - это слово или символ, которые могут изменить одно или несколько значений на другие значения. Например, используя символ * (оператор умножения), мы умножаем величины. Для различных типов данных существуют различные операторы.

---

Использование переменных.(Оператор присваивания)

2010-12-26 19:07:36 (читать в оригинале)

 Когда переменная создана, мы можем хранить в ней данные любого типа по своему усмотрению. Для того чтобы это сделать, нужно использовать знак =. Например, чтобы сохранить значение 2 в переменной score, нужно напечатать такой код:

var score;
score = 0;

В первой строке кода мы создаем переменную, а во второй - сохраняем в ней значение 0. Знак равенства называется оператором присваивания, так как он используется, чтобы присвоить переменной какое-либо значение. Мы также можем создать переменную и сохранить в ней значение с помощью единственного утверждения JavaScript, например:

var score = 0;

Мы также можем сохранять в переменной строки и булевы значения:

var firstName = 'Tema';
var lastName = 'Ivanov';
var age = 22;
var isManyMaker = true;

Важно!____________________________________________________________________________________________________
Чтобы сэкономить время, лучше всего декларировать(присваивать) несколько переменных одним ключевым словом var, например так:

var x, y, z

Одним утверждением JavaScrip можно декларировать и сохранять значения в нескольких переменных:

var isManyMaker=true, isStudent=false;
___________________________________________________________________________________________________________

После того как мы сохранили в переменной значение, мы можем получить доступ к этому значению, просто используя имя переменной. Например, чтобы открыть диалоговое окно предупреждения и отобразить значение, сохраненное в переменной score, давайте напечатаем:

alert (score);

Также давайте обратим внимание, что в переменных не используются кавычки, даже в случае со строками, поэтому в коде alert ('score') будет отображаться слово score, а не значение, сохраненное в переменной score. Теперь можно понять, почему строки следует заключать в кавычки: интерпретатор JavaScript воспринимает слова без кавычек либо как специальные объекты (например, alert()), либо как имена переменных.

Кстати, ключевое слово var должно использоваться только один раз: когда мы создаем переменную. Далее мы можем присваивать ей новые значения, не используя var.

---

Использование маркированных списков.

2010-12-20 13:33:14 (читать в оригинале)

 По сути, панель навигации - не что иное, как набор ссылок, а точнее, она представляет собой список разделов сайта. Из этого следует что? правильно, из этого следует что мы всегда должны использовать теги в соответствии с их функциональным назначением, чтобы они соответствовали заключенному в них содержимому. Например, для списка элементов это должен быть тег <ul>, или тег неупорядоченного, маркированного списка. Не имеет значения, будет ли список вообще без маркеров или будет располагаться горизонтально вдоль верхнего края веб-страницы: всё форматирование тега <ul> обеспечено средствами языка CSS.





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

<ul class="navigation">
       <li><a href="index.php">Главная</a></li>
       <li><a href="news.html">Новости</a></li>
       <li><a href="aboutme">О нас</a></li>
</ul>

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

1. Удалить маркеры. Чтобы панель навигации не была похожа на маркированный список, удаляем маркеры, установив для свойства list-style-type значение none: ul .navigation { list-style-type: none; }
2. Убрать отступы и поля. Так как браузеры сами делают отступы для элементов списка, то мы также избавляемся от них. Однако одни браузеры используют для этих целей свойство padding, а другие - margin, поэтому нам нужно установить для обоих свойств значение 0:

             ul .navigation
             {
                list-style-type: none;
                padding-left: 0;
                margin-left: 0;
             }

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

---

Создание панелей навигации

2010-12-20 12:55:19 (читать в оригинале)

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

---

Ссылки. Использование изображений

2010-12-20 07:53:27 (читать в оригинале)

 Добавление для ссылок изображений - это легкий и эффективный способ улучшить внешний вид элементов навигации сайта. Существует много методик и вариантов дизайна, но при этом следует заметить, что ни в одном их хороших, грамотных методов не применяется HTML тег <img>. Вместо него используется свойство background-image, с помощью которого можно добавить красоты и привлекательности любой ссылке. Вот несколько правил, которые нужно учитывать при использовании изображений со ссылками:

• Не забывать про значение no-repeat. 
• Усправлять позиционированием с помощью свойства background-position. Чтобы точно разместить фоновое изображение, используем свойство background-position. Если необходимо позиционировать изображение по левому краю ссылки, и  при этом еще центрировать его вертикально на строке, то CSS код будет выглядеть так: background-position: left center.
• Добавлять отступы с помощью свойства padding. Не забываем добавлять отступы с помощью этого свойства с той стороны, где рисунок примыкает к тексту.
• Использовать псевдоклассы. Не забываем о псевдоклассах :hover и :visited. Они помогут создать для ссылок красивые динамические эффекты и обеспечат полезную обратную связь с посетителями сайта.