Поделиться Поделиться

Функции: описание и использование

Основные параметры

Над списком можно увидеть характеристики активного слоя, под списком - кнопки управления списком слоев.

Функции: описание и использование - Инвестирование -  1

По щелчку правой кнопкой мыши вызывается меню слоя.

Функции: описание и использование - Инвестирование -  2

В меню слоя дублируются некоторые кнопки управления списком слоев, кроме того, добавлены возможности редактирования границ и размеров слоя, объединения и сведения слоев, работы с масками слоя и альфа-каналами.

4. Атрибуты слоев: имя, тип, a-канал, видимость, непрозрачность, размер.

Имя

Каждый слой имеет несколько атрибутов. Одним из основных атрибутов является имя слоя. Имя слоя можно изменить, дважды щелкнув по нему мышкой или по миниатюрному изображению слоя.

Видимость

Перед миниатюрным изображением расположена пиктограмма с изображением глаза Функции: описание и использование - Инвестирование -  3 . Щелкнув по ней мышкой, можно сделать слой невидимым. Сделать слой временно невидимым бывает необходимо, когда вы работаете с изображением, содержащим множество слоев с разной прозрачностью. Удобно отредактировать или настроить нужный вид слоя, отключив видимость других слоев.

Размер слоя

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

Непрозрачность

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

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

Альфа-канал - выделенная область- создает контур выделения по прозрачным участкам изображения. Например, если мы имеем прозрачное изображение с нарисованной на нем буквой А, то применение этого пункта меню даст выделение только буквы А, при этом неважно какого она цвета или текстуры

5. Режим слоя.

6. Создание, правка, дублирование, прикрепление, перемещение, удаление, объединение, сведение слоев.

7. Текстовые слои.

8. Использование окна GIMP "история действий" при создании анимированных изображений.

9. Основы построения web-страниц табличный дизайн, каскадные стилевые таблицы CSS как основа современного дизайна: свойства элементов: float, clear (обтекание, плавающее? позиционирование), z-index, position (static, fixed, absolute, relative).

10. Особенности и практические технологии позиционирование элементов при создании старниц сайтов.

11. DHTML как средстов динамических технологий.

12. Сценарии (программы на Javascript).

13. Элементы языка: символические имена, переменные, типы переменных, основные математические (арифметические, логические) операции, приоритет; математические выражения: блок, операторы, присваивания?, развилки, циклов(for, while), выбора; подпрограммы-функции: описание, вызов, фактические и формальные параметры.

14. Объекты Java-script Math.

15. Date: основные методы.

16. Функции setinterval, clearinerval.

17. Включение сценариев в html-документ.

18. Тэг "script"

19. Диалоговые окна alert, comfirm, promt, их назначение, использование в сценариях.

20. Объектная модель документа; представление документов на основе DOM;

объект document: методы getElementById, getElementByTagName, create Element, create Text Node, свойство documentElement;

объект Element: методы getAttribute, getAttribute, remove Attribute, style, class Name, свойство tag Name;

объект node: методы appendChild, insertBe sore, remove Child, replace Child, hasChildNodes.

21. Передвижение по документу: свойство объекта Node - first Child, last Child, previous Sibling, next Sibling, parent Node, node Name, node Type.

22. Примеры управления структурой документа, свойствами элементов и атрибутами тэгов на основе объектов DOM, стилей и сценариев Java-script.

23. Модель событыий Dom, объекты Event (свойства type, target), Mouse Event (свойства button, clientX, clientY, screenX, screenY, и др.)

24. Основные события click, dbclick, moseup, moseover, mosemove, moscout, load, onload, др.)

25. Пример сценария, управляемого событиями.

26. Рекламные баннеры: назначения, требования, предъявляемые к баннерам, стандартные размеры, особенности размещения на web-странице, критерий эффективности, средства повышекния эффективности.

27. Обновление баннеров на web-странице, последовательно выбираемых из массива.

28. Обновление баннеров на web-странице, выбираемых из массива, случайным образом.

5. Режим слоя.

У GIMP двадцать один режим слоя. Режимы слоя иногда называются «режимами смешивания». Выбор режима слоя изменяет внешний вид слоя или изображения в зависимости от низлежащих слоёв. Если есть только один слой, то режим слоя ни на что не влияет. Поэтому должно быть по крайней мере два слоя, чтобы использовать режимы слоя.

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

На панели инструментов есть список, содержащий режимы, которые влияют на инструменты рисования также, как и режимы слоя. GIMP использует те же режимы для слоя, что и для рисования, и есть два дополнительных слоя только для рисования. За дополнительной информацией обратитесь сюда: Раздел 3.3, «Кистевые инструменты (Карандаш, Кисть, Аэрограф)».

Режимы слоёв позволяют изменять цвета в изображении сложным образом. Они обычно применяются для нового слоя, который ведёт себя как маска. Например, если новый белый слой поставит в режим «Насыщенность», то нижние слои будут выглядеть серыми.

В описании режимов слоёв ниже также показано уравнение. Это для тех, кому интересна математическая сторона вопроса. Понимать уравнения не обязательно для эффективного использования режима.

Уравнение означает «для каждой точки верхнего слоя (Маска) и нижнего слоя (I изображение) сложи соответствующие цветовые компоненты вместе, чтобы получить цвет точки результата.» Значения цветовых компонентов всегда между 0 и 255.

Если ниже специально не оговорено, отрицательные значение ставятся на 0, а те, что больше 255-ти — на 255.

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

Нормальный режим - режим по умолчанию. Верхний слой полностью покрывает нижний слой. Чтобы показался нижний слой, необходимо создать прозрачные области в верхнем слое.

Режим Растворение растворяет верхний слой в нижнем рисованием случайного узора точек в областях частичной прозрачности. Он больше подходит для инструментов рисования, чем для режимов слоя.

Это особенно заметно вокруг краёв в изображении. В увеличенном снимке экрана изображение слева показывает «Нормальный» режим слоя, а изображение справа показывает те же два слоя в режиме «Растворение», где хорошо видно разброс точек.

Режим Умножение перемножает значение точек верхнего и нижнего слоёв и делит на 255. Результат обычно темнее искомого изображения. Если один из слоёв белый, то результат равен другому слою. Если один из слоёв белый, то результат тоже чёрный.

Режим Деление умножает значение точки нижнего слоя на 256 и делит на значение точки верхнего слоя плюс один. Слагаемое «+ 1» находится в уравнении для того, чтобы избежать деления на ноль. Результат обычно светлее исходного изображения, и иногда выглядит «выжженным».

Режим Экран инвертирует значения точек верхнего и нижнего слоёв (т.е. вычитает их из 255-ти), умножает их, делит на 255 и инвертирует результат. Результат обычно светлее исходного изображения, и иногда выглядит «выцветшим». Исключение составляют чёрный слой, который не меняет результата, и белый слой, результат которого - белое изображение. Тёмные цвета выглядят более прозрачными.

Режим Перекрытие инвертирует точки нижнего слоя, умножает на значение точки верхнего слоя, умножает на два, прибавляет результат к исходному значению точки нижнего слоя, делит на 255, умножает на исходное значение точки нижнего слоя и делит на 255 во второй раз. Обычно он затемняет изображение, но не на столько, как режим «Умножение».

Режим Добавление складывает значения точек верхнего слоя со значениями точек нижнего слоя, чтобы получить конечное изображение. Результат обычно светлее искомого изображения. значение больше 255, получаемые в результате применения уравнения, заменяются на 255.

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

Режим Значение использует яркость верхнего слоя и насыщенность и тон нижнего слоя, чтобы получить конечное изображение. Он годится, когда нужно выявить детали из тёмных или светлых областей изображения, не меняя насыщенности.

У каждого слоя изображения может быть свой режим. Конечно же, режим самого нижнего слоя не имеет никакого значения. Эффект режимов слоёв накапливающийся. У изображения внизу три слоя. Верхний слой содержит Уилбера, окружённого прозрачностью с режимом «Разницы». Второй слой сплошной синий с режимом «Добавления». Нижний слой заполнен текстурой «красных квадратов».

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

6. Создание, правка, дублирование, прикрепление, перемещение, удаление, объединение, сведение слоев.

Создание нового слоя

Создадим еще один слой. На панели Слои нажмите кнопку создать новый слой и добавить его в изображение

Появляется окно Новый слой.

Здесь мы должны задать следующие параметры вновь создаваемого слоя: • Имя слоя — необходимо задать какое-либо имя, чтобы в дальнейшем можно было легко узнать данный слой в общей массе остальных слоев. Имя должно быть уникальным и не повторяться, желательно, чтобы оно отражало сущность содержимого слоя; • Ширина и Высота — параметры размера вновь создаваемого слоя. В большинстве случаев слой создается того же размера, что и само изображение, поэтому значения размера изображения вводятся здесь автоматически. Справа от параметра Высота располагается опция выбора вариантов единиц измерения размера слоя; • Тип заливки слоя — здесь мы должны задать вариант содержания слоя: Цвет переднего плана, Цвет фона, Белый, Прозрачный. Наиболее востребован вариант Прозрачный, так как в этом случае данный слой не будет визуально перекрывать все остальные. Если мы выберем другой вариант, то вновь созданный слой перекроет предыдущие.

Настроив все необходимые параметры в данном окне (а в большинстве случаев оставив у них стандартные значения), нажимаем кнопку OK. Обратите внимание, что на панели слоев, над слоем Фон появился новый слой, который так и называется — Новый слой.

Работа со слоями

Слева от названия располагается небольшой прямоугольник, содержащий уменьшенный вариант изображения слоя. У слоя Фон этот прямоугольник белый, и соответственно мы видим пустое белое изображение. У слоя Новый слой прямоугольник клетчатый: так программа отображает прозрачное содержание.

Щелкнув по слою Фон, мы выделяем его, о чем свидетельствует серая линия. Щелкнув по слою Новый слой, мы убираем выделение со слоя Фон и выделяем его.

Выделите слой Новый слой, возьмите инструмент Кисть и нарисуйте какие-либо штрихи кистью цветом, отличным от цвета предыдущих штрихов.

Таким образом мы получили комбинированное изображение, состоящее из двух разных элементов, каждый из которых располагается на своем собственном слое.

СОВЕТ: При создании нового слоя всегда старайтесь задать ему уникальное имя: это позволит легко найти его в дальнейшем среди десятков подобных слоев.

Движение слоев

Попробуем двигать изображения на слоях в разные стороны. Выберите инструмент Перемещение.

Убедитесь, что на панели слоев выделен Новый слой, затем наведите курсор на последний созданный штрих (принадлежащий Новому слою), нажмите кнопку мыши и, не отпуская ее, переместите слой в сторону. В результате все штрихи, содержащиеся на Новом слое, будут перемещаться вместе с курсором. Таким образом мы передвинули один слой, не затрагивая другой, и изменили тем самым содержание изображения.

Обратите внимание на параметры инструмента Перемещение.

Здесь можно показать, что именно мы будем перемещать — Слой, Выделение или Контур. Выбрав первый вариант, мы будем двигать весь слой целиком. При выборе вариантов Выделение или Контур — только выделение или контур, если они есть на изображении.

Далее располагается опция Переключатель инструмента. Здесь можно выбрать один из следующих вариантов: • Выбрать слой/направляющую позволяет перемещать тот слой, на штрих которого наведен инструмент. Если у вас несколько разных слоев, каждый из которых содержит какое-либо изображение, то перемещаться будет тот слой, на изображение которого наведен курсор;

Работа со слоями

• Переместить активный слой — при выборе данного варианта перемещаться будет лишь один слой на панели Слои, независимо от того, на элемент какого слоя наведен курсор. В некоторых случаях данный режим будет удобнее, чем первый.

Таким образом, при движении слоев необходимо выделить нужный слой, а затем применить к нему инструмент Перемещение.

Удаление слоев

Любой слой можно удалить, при этом мы удаляем и все его содержимое. Для удаления слой необходимо выделить, а затем нажать кнопку Удаляет активный слой в нижней части панели Слои.

Видимость слоев

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

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

Щелкая по данной кнопке, мы включаем и выключаем режим отображения слоя. Если отображение отключено, то содержимое слоя визуально удаляется из общей картины. Однако, включив отображение, мы возвращаем его.

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

Параметры слоя

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

Режим определяет характер смешивания содержимого слоя с содержимым нижерасположенных слоев. Чтобы понять действие этого параметра, откройте какой-либо полноцветный клипарт или фотографию и создайте новый слой, чтобы на панели слоев было два слоя: Фон и Новый слой. С помощью инструмента Кисть нанесите на Новый слой какие-либо штрихи, например, зеленого цвета (не используйте черный: пример не будет наглядным). Созданные штрихи будут перекрывать изображение. Попробуйте теперь комбинировать разные варианты режимов смешивания в списке Режим. Каждый раз внешний вид штрихов будет немного меняться, так как способ их смешивания с фоном будет отличаться. Например, при выборе варианта Растворение штрихи как будто растворяются в фоне; при выборе варианта Затемнение сквозь штрихи становится виден фон, но они при этом его немного затемняют; при выборе варианта Осветление происходит то же самое, но штрихи уже осветляют фон, при выборе варианта Рассеянный свет штрихи как будто нарисованы светом и т. д.

Непрозрачность — параметр, позволяющий сделать содержимое слоя полупрозрачным. Значение этого параметра варьируется от 0 до 100. Чем выше значение, тем менее прозрачен слой. Например, если задать значение непрозрачности равным 0, то слой будет совершенно прозрачным. Это то же самое, что просто отключить его видимость. Сквозь содержимое верхних полупрозрачных слоев видно содержимое расположенных ниже, что также позволяет смешивать содержимое двух или более слоев. Более подробно мы рассмотрим прозрачность слоев при работе с масками слоя.

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

Дублирование и объединение слоев

Можно дублировать один и тот же слой несколько раз, а можно, наоборот, объединить содержимое двух и более слоев в один.

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

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

Для объединения двух или более слоев сначала укажите первый объединяемый слой в стопке слоев. Затем нажмите правую кнопку мыши

Работа со слоями на изображении этого слоя и в появившемся меню выберите пункт Объединить с предыдущим.

Содержимое данного слоя будет объединено с содержимым предыдущего слоя в стопке, а вместо двух будет уже лишь один слой.

Если вы хотите объединить все имеющиеся слои и превратить изображение в единое, не разделенное на слои вообще, то в выпадающем меню любого слоя необходимо выбрать пункт Свести изображение.

Содержимое слоев объединится в одном.

Если вы хотите объединить элементы, содержащиеся лишь на тех слоях, у которых активна опция видимости, выберите в меню слоя пункт Объединить видимые слои.

Скрепление слоев

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

Нажмите на нее, чтобы у каждого из слоев, содержащих штрих, появилась цепь. Таким образом мы скрепляем данные слои. Скрепленные слои передвигаются синхронно, расстояние между элементами, содержащимися на них, не изменяется. Так можно временно скреплять определенные слои. Для полного объединения слоев необходимо выполнять соответствующую опцию, описанную выше.

7. Текстовые слои.

Работа с текстом в GIMP производится с помощью инструмента для создания и редактирования текстовых слоёв.

При этом указатель мыши принимает соответствующий вид - вертикальный указатель с верхней и нижней горизонтальными засечками.

Чтобы начать использовать инструмент "Текст" кликните по иконке на панели инструментов с пиктограммой в виде буквы "А" или нажмите горячую клавишу Т.

Теперь вы можете расположить текст в любой точке изображения, просто кликнув по нему указателем. Автоматически будет создан новый специальный текстовый слой. Текстовый слой отличается от обычного слоя изображения тем, что в нём хранится текстовая информация.

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

Запомните, что параметры текста сохраняются отдельно для каждого текстового слоя и динамически меняются на панели параметров инструментов при активизации соответствующего текстового слоя.

Текст содержащийся на активном текстовом слоё, будет обрамлён прямоугольником, который напоминает собой прямоугольное выделение.

Поместив курсор ближе к центру слоя, можно перетаскивать текст по изображению мышью.

Захватив мышью один из квадратов по углам текстового слоя, можно менять его размер по диагонали.

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

Параметры инструмента "Текст" во многом напоминают таковые в любом текстовом редакторе.

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

Кнопке сопутствует строка быстрого поиска, позволяет искать шрифт по названию.

Начните вводить его в этой строке, например "Sans" и вы получите выпадающий список со всеми разновидностями шрифтов этого семейства.

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

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

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

Полезная функция, может быть всегда включена.

Здесь имеется свой собственный инструмент по выбору цвета - кнопка, которая залита текущим цветом шрифта. Левый клик по кнопке вызывает стандартный для GIMP диалог выбора цвета.

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

Следующий параметр - "Выключка" или просто выравнивание текста, регулируется кнопками. Для применения настройки по выравниванию следует нажать требуемую кнопку.

Первые три кнопки настраивают выравнивание по левому или правому краям и по центру соответственно. Последняя кнопка - "Полная выключка", подразумевает растягивание текста по всей ширине слоя.

Ниже идут три поля для настройки интервалов, сюда можно ввести значения или изменять их стрелками вверх и вниз.

Это значения отступа первой строки в параграфе, межстрочный интервал и интервал между символами соответственно.

Нижние две строки занимают кнопки. Кнопка "Текст по контуру" позволяет одним нажатием превратить текст в контур и расположить его вдоль текущего активного контура.

Нажатие кнопки "Контур из текста" создаёт из текста контур, который можно редактировать с помощью инструмента "Контуры".

Работу с контурами мы рассмотрим в следующих статьях.

Напоследок рассмотрим ещё одну особенность текстового слоя.

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

Но при этом текстовый слой примет свойства обычного, и текстовая информация будет вести себя как растровое изображение.

Если вы снова попытаетесь редактировать этот слой инструментом "Текст", появится следующее диалоговое окно.

Если нажать "Изменить", результаты рисования будут отменены и слой снова превратится в текстовый.

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

11. DHTML это не новая спецификация языка гипертекста, а скорее новый подход к обработке стандартных тегов и команд. Когда речь идет об обычном HTML-сайте, веб-страница загружается в браузер с сервера и остается неизменной до, как это любят говорить политики, "перезагрузки”. Поэтому такие сайты и называют статическими, то есть неизменными. С другой стороны, технология DHTML предусматривает обработку веб-страницы на стороне клиента, то есть в браузере. Динамическая страница чутко реагирует на манипуляции пользователя и изменяется прямо в браузере, не требуя возврата на сервер хостинг-провайдера. Поскольку в динамическом сайте не требуется гонять страницы туда-сюда, все процессы происходят намного быстрее и DHTML-сайт выглядит очень шустрым. Хотя здесь есть и недостаток. В статическом сайте вы всегда сможете вернуться на просмотренные страницы и дочитать что нужно. В динамическом сайте возврата к прошлому не бывает – веб-страница всегда будет иметь уникальный вид.

Как устроен DHTML

Есть четыре главные части DHTML:

1. DOM – объектная модель документа.

2. Программные элементы – скрипты.

3. CSS – каскадные таблицы стилей.

4. XHTML.

DOM

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

Скрипты

Скрипт это небольшая программа, написанная на одном из языков программирования, обычно javascript. Скрипты используются для активации DHTML, превращения статики в живую динамику событий. Все находящиеся на странице скрипты управляются объектной моделью документа

Каскадные таблицы стилей

Чтобы не прописывать для каждой буквы формат и стиль, используется общая для сайта CSS, таблица стилей. В ней все подробно прописано, что и как должно выглядеть на экране. За счет использования каскадных таблиц стилей достигается единообразие отображения сайта в разных типах браузеров. Таблица стилей определяет цвета, фоны и все это может быть динамически изменяемо при помощи скриптов и DOM.

XHTML

Строгая версия языка HTML с использованием формата XML. XHTML используется для создания собственно веб-страницы. В кодировке определены расположение и размер всех элементов, последовательности и порядки. Вместо XHTML может быть применена версия HTML 4.X.

Динамическое возможности DHTML

В итоге, что же получается на динамических страницах сайта DHTML? Пользователь действительно может на специфическом уровне общаться с сайтом. Страница может быть реализована как игра и тогда пользователь может играть с сайтом в игры. Или элементы контента и дизайна могут перемещаться по странице в соответствии с пожеланиями посетителя. Возможности DHTML позволяют создавать полностью интерактивные сайты. Это полезно в практических целях. Например, на сайтах интернет-магазинов с помощью DHTML пользователь может выбирать товары, задавать вопросы и получать ответы, созвать заявки и оформлять заказы. И все это делается, как говорится, без помощи человека – при помощи запрограммированных на определенное реагирование скриптов.

С помощью DHTML можно создавать сайты-презентации, слайд-шоу, проводить рекламные промоакции, развлекать и увлекать потенциальных клиентов. Разумеется, DHTML придумывали не для игр, а именно для решения практических коммерческих задач, для которых в обычном сайте требовалось наличии живого менеджера для ответов на вопросы посетителей.

Однако DHTML сегодня уже прошлый век. На подходе и уже частично реализуется новая версия HTML 5. Этот инновационный язык гипертекста будет своего рода компиляцией наработок всех предыдущих версий HTML.

Язык сценариев JavaScript

Язык программирования JavaScript разработан фирмой Netscape в сотрудничестве с Sun Microsystems и предназначен для создания интерактивных HTML-документов. Основные области использования JavaScript таковы: создание динамических страниц, т. е. страниц, содержимое которых может меняться после загрузки документа; проверка правильности заполнения пользователем форм до пересылки их на сервер; решение "локальных" задач с помощью сценариев и некоторые другие сферы.
JavaScript позволяет создавать приложения, выполняемые как на стороне клиента, так и на стороне сервера. При разработке приложений обоих типов используется так называемое ядро, в котором содержатся определения стандартных объектов. Клиентские приложения выполняются браузером на машине пользователя.
Программа (сценарий) на языке JavaScript обрабатывается встроенным в браузер интерпретатором. Надо стремиться к тому, чтобы написанные сценарии корректно выполнялись в любом браузере. На первоначальном этапе обучения добиться удовлетворения этого требования сложно. Предлагаемые в книге сценарии отлаживались в Internet Explorer версии 4.01 и выше.

Программа (сценарий) на языке JavaScript представляет собой последовательность операторов. Если несколько операторов располагаются на одной строке, то между ними следует поставить знак "точка с запятой" ( ; ). Если каждый оператор размещается на одной строке, то разделитель можно не писать. Один оператор может располагаться на нескольких строках.
Согласно принципам структурного программирования, программу рекомендуется записывать таким образом, чтобы в ней была отражена блочная структура. Это облегчает исследование программы и поиск ошибок.
В программах на JavaScript можно использовать комментарии. Для того чтобы задать комментарий, располагающийся на одной строке, достаточно перед его текстом поставить две косые черты (//). Если же поясняющий текст занимает несколько строк, то его следует заключать между символами /* и */. В JavaScript строчные и прописные буквы алфавита считаются разными символами.

Литералы
Простейшие данные, с которыми может оперировать программа, называются литералами. Литералы не могут изменяться. Литералы целого типа могут быть заданы в десятичном (по основанию 10), шестнадцатеричном (по основанию 16) или восьмеричном (по основанию 8) представлении. Литерал целого типа в десятичном представлении записывается как последовательность десятичных цифр со знаком или без него, например, 15, 123, -156, +3567.
Шестнадцатеричные числа включают цифры 0-9 и буквы а, b, с, d, e, f. Шестнадцатеричные числа записываются с символами Ох перед числом, например, 0x25, 0xa1,0xff.
Восьмеричное число включает только цифры 0-7 и записывается, начиная с нуля, например, 03, 0543, 011.
Запись вещественного литерала отличается от записи вещественного числа в математике тем, что вместо запятой, отделяющей целую часть от дробной, указывается точка, например, 123.34, -22.56. Кроме того, для записи вещественных чисел можно использовать так называемую экспоненциальную форму, например, число 0,000000273, которое можно представить в виде 2.73x10 ~7, в языке JavaScript записывается так: 2.73е~7. В такой записи знак умножения и число 10 заменяются символом е. В записи вещественного литерала должна присутствовать, по крайней мере, одна цифра и десятичная точка или символ экспоненты (е или Е).
Кроме целых и вещественных значений в языке JavaScript могут встречаться так называемые логические значения. Существуют только два логических значения: истина и ложь. Первое представляется литералом true, второе - false. В некоторых реализациях JavaScript может быть использована единица в качестве true, и ноль в качестве false.
Строковый литерал представляется последовательностью символов, заключенной в одинарные или двойные кавычки. Примером строкового литерала может быть строка "результат" или 'результат'. Строковый литерал, представляющий пустую строку, обозначается как "" или ' '. НАВЕРХ
Переменные
Переменные используются для хранения данных. Переменные в сценарии представляются с помощью идентификаторов. Идентификатор должен начинаться с буквы латинского алфавита, либо с символа подчеркивания. Далее может указываться последовательность, содержащая буквы латинского алфавита, цифры или знак подчеркивания, например, testi, _my_test, test_l. Тип переменной зависит от хранимых в ней данных, при изменении типа данных меняется тип переменной. Определить переменную можно с помощью оператора var, например:
var test1
В данном случае тип переменной test1 не определен и станет известен только после присвоения переменной некоторого значения.
Оператор var можно использовать и для инициализации переменной, например, конструкцией
var test2=276
определяется переменная test2 и ей присваивается значение 276.
Значение переменной изменяется в результате выполнения оператора присваивания. Оператор присваивания может быть использован в любом месте программы и способен изменить не только значение, но и тип переменной. Оператор присваивания выглядит так
а=b
где а - переменная, которой мы хотим задать некоторое значение; ь - выражение, определяющее новое значение переменной. Пусть в сценарии описаны следующие переменные
var n=3725
var x=2.75
var p=true
var s="Выполйение завершено"
Переменные п и х имеют тип number, тип переменной р - логический, переменная s имеет тип string. В JavaScript определен тип function для всех стандартных функций и функций, определяемых пользователем. Объекты JavaScript имеют тип данных object. Переменные типа object часто называют просто объектами, они могут хранить объекты.

← Предыдущая страница | Следующая страница →