2015-09-07
381
Смена картинки через onMouseOver()
<a onMouseOver="document.pic1.src='a.gif'" onMouseOut="document.pic1.src='b.gif'">
<IMG SRC="b.gif" BORDER=0 NAME="pic1"> </a>
Когда убираете курсор с картинки, появляется b.gif. Когда наводите на картинку, появляется а.gif.
Обратите внимание, что команда IMG связана с обработчиками onMouse в команде HREF через команду NAME="pic1". Не имеет значения, сколько изображений у вас на странице и в каком порядке они располагаются, если вы присвоили отдельное имя каждой нужной картинке.
- onMouseOver и onMouseOut различают регистр. Нельзя менять заглавные и строчные буквы.
- Так как необходимо ставить кавычки после onMouseOver= и onMouseOut=, название файла *.gif ставится в одинарные кавычки.
- document.pic1.src следует иерархии объектов. Document относится к объекту документ, a pic1 — это имя объекта изображение (имя можно придумать какое угодно). src (источник) — это свойство объекта изображение, которое указывает файл с картинкой.
- В этом примере onMouseOver меняет источник изображения на а.gif.
- ОnMouseOut заставляет объект изображение показывать b.gif.
- Имейте в виду, что для наилучшего эффекта картинки должны быть одинакового размера.
Еще один пример использования onMouseOver и onMouseOut. На этот раз обработчики событий onMouseOver и onMouseOut вызывают функцию.
|
|
|
В общем, когда вам нужна только одна команда JavaScript, можно включить ее целиком в <A HREF>. Для многократного повторения больше подходит функция.
<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
function up()
{
document.mypic.src="a.jpeg";
}
function down()
{
document.mypic.src="b.jpeg";
}
</SCRIPT>
</HEAD>
<BODY>
<CENTER>
<h2>Пример анимации</h2>
<A onMouseOver="up()" onMouseOut="down()">
<IMG SRC="b.jpeg" NAME="mypic" BORDER=0>
</BODY>
</HTML>
Случайные числа
Генерируя случайные числа, JavaScript пользуется датой и временем.
<HTML>
<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
function rand()
{
var now=new Date();
var num=(now.getSeconds())%10;
var num=num+1;
alert(num);
if(num>2) {alert(num+ " больше 2");}
else {alert(num+ " меньше или равно 2");}
}
</SCRIPT>
</HEAD>
<BODY>
<h1>Случайное число</h1>
<form>
<INPUT TYPE="button"
VALUE="Случайное число от 1 дo 10"
onClick="rand()">
</FORM>
</BODY>
</HTML>
- Случайный выбор числа осуществляется в несколько шагов:
- Во-первых, создаем функцию, к примеру, rand().
- Потом создаем переменную для метода new Date().
- И еще одну переменную, num. Она содержит метод getSeconds(), так как в данном случае мы воспользуемся секундами, чтобы выбрать случайное число. Элемент %10 говорит скрипту, что нужно выбирать из десяти чисел.
- В JavaScript отсчет начинается с нуля. Таким образом, прибавляя к случайному числу единицу (num=num+1), мы задаем числа не от 0 до 9, а от 1 до 10.
- alert показывает число.
- if(num>2) пример использования оператора if. За if следует условие и указание, что делать, если оно верно. Верным может быть одно условие или несколько. Скрипт знает, где начинаются и кончаются верные условия, потому что они заключены в {фигурные скобки}. if/else (если/иначе) дают вам дополнительный контроль над программой, позволяя принимать решения на оба случая: и когда условие выполнено, и когда не выполнено.
|
|
|
