Использование JavaScript на HTML-странице. Взаимодействие с CSS: cоздание динамических меню, модельных рядов

Рассмотрим пример кода, который при наведении указателя мыши на ячейку подсвечивает фон черным, а текст белым. Если внутри расположена ссылка, то она тоже меняет цвет на белый. Скрипт основан на динамической смене стилей элементов. Ячейка становится подсвеченной по событию onmouseout=”out(this)” и принимает обычный вид по событию onmouseout=”out(this)”. Назначаемые стили описаны предварительно в блоке <head>.

<style type="text/css">

td.select {background-color: #000000; color: #ffffff}

td.select a{color: #ffffff}

td.normal{background-color: #ffffff; }

td.normal a{color: #000000}

</style>

<script language="JavaScript">

<!--

function over(id){// подсветка ячейки

id.className="select";

}

function out(id){// удаление подсветки

id.className="normal";

}

-->

</script>

<body>

<table border="1">

<tr>

<td onMouseOver="over(this);" onmouseout="out(this);" class="normal"> Ячейка1 </td>

<td onmouseover="over(this);" onmouseout="out(this);"> <a href="#">Ячейка2 </a></td>

</tr>

</table>

</body>

</html>

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

Принцип реализации заключается в следующем. Все меню помещено в тег <div>, которому назначается абсолютное позиционирование с помощью таблиц стилей. Подменю находятся в тегах <div>, которые при загрузке страницы невидимы. Отображениеблоков выпадающего меню происходит по событию наведению мыши на пункты меню, при котором вызывается функция, которое устанавливает своиство display: block для подменю для данного пункта меню. При уходе указателя мыши вызывается функция, которая прячет подменю путем установки своиства display: none для данного подменю.

16.Скриптовый язык PHP. Типы данных, переменные, управляющие структуры.

Переменные

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

Операция, неразрывно связанная с переменными, – операция присваивания (=). Рассмотрим следующий пример:

<? $а=7.135; $a=15; $mess4="Четверг";

echo "Сегодня $mess4, $a -ое";

$9sad=194 //Неправильное имя переменной

?>

Типы данных языка PHP

Скалярные типы данных

» Двоичные данные (boolean) Это простейший тип. Он выражает истинность значения - это может быть либо TRUE, либо FALSE. Булев тип был введен в PHP4.

[»Целые числа (Integer) Целое - это число из множества Z = {..., -2, -1, 0, 1, 2,...}, обычно длиной 32 бита (от –2 147 483 648 до 2 147 483 647).

»Числа с плавающей точкой (Float)

[»Строки (String) Строка в PHP - это набор символов любой длины.

управляющие структуры

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

Конструкция множественного выбора представляет собой компактную форму записи длинных цепочек условий вида "if...elseif....elseif.......else". В PHP такая конструкция носит название switch. Конструкции повторения (организации циклов) предназначены для многократного выполнения одних и тех же выражений. К этим конструкциям относятся while, do-while, for.

<?php

if(условие)

{ выражения-1; }

else { выражения-2; }

?> Оператор for Цикл типа for выполняется до тех пор пока заданное условие не примет значение false. Этот оператор цикла аналогичен традиционному for циклу языка Си. Формат оператора: <?php

for (переменная; условие; оператор)

{ выражения; }?>

Оператор while. Оператор цикла while выполняет повторение до тех пор, пока значение заданного условия остается равным true. Формат оператора:

<?php

while (условие)

{ выражения; }

do { выражения; }

while (условие);

?> }

switch Сравнивает значение выражения с различными вариантами и при совпадении выполняет соответствующий код Синтаксис <?php

switch (выражение/переменная)

{

case значение-1: выражения-1; break;

case значение-2: выражения-2; break; …

default: выражения-N; break; }

?>


Понравилась статья? Добавь ее в закладку (CTRL+D) и не забудь поделиться с друзьями:  



double arrow
Сейчас читают про: