Перемещение окна

Операции с окном

Для окон, открытых с помощью метода open(), можно выполнять следующие операции:

· перемещение;

· прокрутка;

· изменение размера.

Чтобы окно, открытое с помощью метода open(), передвигалось по экрану, необходимо изменять его координаты: вертикальную, горизонтальную или сразу обе.

Для окон перемещение выполняется с помощью методов moveTo(x, y) и moveBy(dx, dy). Первый метод перемещает окно в точку с заданными координатами x и y, второй – на заданное расстояние по горизонтали dx и вертикали dy (эти значения могут быть как положительными, так и отрицательными).

При использовании этих методов moveTo() и moveBy() окно перемещается в новую позицию практически мгновенно, например, фрагмент сценария

moveWin = window.open("newWindow.html", "movingWindow",

"width=300, height=200, top=0, left=0, status=no,

toolbar=no, menubar=no");

…

moveWin.moveBy(10, 20);

открывает окно moveWin, а затем перемещает его на 10 пикселей по горизонтали и на 20 пикселей по вертикали.

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

Чтобы управлять величиной временных интервалов между кадрами, а, следовательно, и частотой появления кадров, в JavaScript используются методы управления временными интервалами setInterval(), setTimeout(), clearInterval() и clearTimeout() объекта window.

Методы

таймер = setInterval(выражение, интервал, список-аргументов-функции)

таймер = setTimeout(выражение, интервал, список-аргументов-функции)

действуют одинаково: вычисляют значение выражения или вызывает функцию, заданную своим именем, каждый раз по истечении заданного интервала (в миллисекундах). Если в первом параметре задан вызов функции и для вызова необходимо задать аргументы, эти аргументы, разделенные запятыми, записываются после аргумента интервал. Методы возвращают созданный объект таймер.

Методы

clearInterval(таймер)

clearTimeout(таймер)

останавливают и уничтожают таймер, установленный соответственно методом setInterval() или методом setTimeout().

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

timer = window.setInterval("moveWin.moveBy(10, 20)", 100);

будет запускать выполнять перемещение определенного выше окна moveWin каждые 100 миллисекунд. Для прерывания перемещения надо выполнить предложение

window.clearInterval(timer);

Следует иметь в виду, что это перемещение должно происходить в пределах экрана. Ширину и высоту экрана дисплея можно получить с помощью свойств screen.width и screen.height. Размер окна, занимаемый Web-страницей, можно получить в Internet Explorer с помощью свойств document.body.clientWidth и document.body.clientHeight, а в остальных Web-браузерах – с помощью свойств innerWidth и innerHeight объекта window.

Так, для ограничения перемещения окна границами экрана дисплея в функции можно использовать следующую последовательность предложений (winLeft – позиция левой границы окна, winWidth – ширина окна, dx – смещение по оси x за один кадр, winTop – позиция верхней границы окна, winHeight – высота окна и dy – смещение по оси y за один кадр):

// Если окно достигло правой или

// левой границ родительского окна

if(winLeft+winWidth+dx > winWidth || winLeft+dx < 0)

// Изменение направления движения

// на противоположное

dx=-dx;

// Если окно достигло нижней или верхней границ родительского окна

if(winTop+dy > windowHeight || winTop+dy < winHeight)

// Изменение направления движения

//на противоположное

dy=-dy;

Пример 4.5.63. Перемещение окна по экрану: