- •Практична работа №9.
- •Тема: “Организация анимации.”
- •Теоретические сведения.
- •Строка состояния и эффект «бегущей» строки
- •Строка «бежит» слева направо
- •Строка «бежит» справа налево
- •Практическое задание №1
- •Введение в объектную модель документа (dom) Обращение к элементу
- •Смена оформления элемента
- •Мигание
- •Математические функции и перемещение элементов Математические функции
- •Перемещение элементов
- •Полярная система координат
- •Основы перемещения элементов
- •Движение по прямой
- •Движение по окружности
- •Движение исключительно в пределах окна
- •Практическое задание №2
- •Слайд-шоу
- •Смена картинок
- •Слайд-шоу
- •Практическое задание №3
Слайд-шоу
var URIs = new Array('./images/15-1.jpeg', './images/15-2.jpeg', './images/15-3.jpeg', './images/15-4.jpeg'); // Сохраняем пути в массиве.
var currentImage = 1; // Сохраняем пути в массиве.
function slideShow() { // Определяем функцию.
if (currentImage >= URIs.length) // Не вышел ли счётчик за пределы массива.
currentImage = 0; // Обнуляем счётчик.
document.getElementById('slide').setAttribute('src', URIs[currentImage]); // Меняем картинку.
currentImage++; // Увеличиваем счётчик.
}
setInterval(slideShow, 2500);
Вы можете посмотреть, как же выполнится приведённый код.
Функция вроде бы проста. Единственный нюанс, на который стоит обратить внимание, заключается в бесконечном переборе элементов массива. Как только наш счётчик выходит за пределы длины массива, мы его обнуляем и начинает работу с массивом с самого начала.
Практическое задание №3
Мы перебираем массив последовательно, то есть после первого «слайда» всегда будет идти второй, после второго — третий и так далее. Ваша задача — отображать фотографии в произвольном порядке. Но при этом между любыми повторениями должно быть хотя бы одно альтернативное изображение. (Другими словами, изображения a, b, c, d могут идти как a, c, a, c, b, d, но не как a, a, c, c, d, b, то есть не допускайте повторений двух фотографий подряд.)
Задание:
Вариант №1.
Организовать движение какой-нибудь строки, по траектории: y=sin(x2)+cos(x2). При построении использовать масштабирование. Диапазон значений выбрать самостоятельно. Организовать мигание.
Для выполнения следующего задания с помощью любого графического редактора создать три графических файла: прямоугольник, треугольник, круг.
Нарисовать следующую картинку: фон – зеленый; в левом верхнем углу находится треугольник (красный); посредине экрана закрашенный прямоугольник (синий); из треугольника летит коричневый закрашенный шарик, отскакивает от прямоугольника и летит в левый нижний угол. Рисунок подписать.
Выполнить практические задания 1-3.
Вариант №2.
Организовать движение какой-нибудь строки, по траектории: y=sin(x)*cos(x). При построении использовать масштабирование. Диапазон значений выбрать самостоятельно. Организовать мигание.
Для выполнения следующего задания с помощью любого графического редактора создать три графических файла: прямоугольник, треугольник, круг.
Нарисовать следующую картинку: фон – белый; в левом верхнем углу находится треугольник (зеленый); посредине экрана закрашенный прямоугольник (красно-синий); из треугольника летит красный закрашенный шарик, отскакивает от прямоугольника и летит в правый верхний угол. Рисунок подписать.
Выполнить практические задания 1-3.
Вариант №3.
Организовать движение какой-нибудь строки, по траектории: y=tan(x)+cos(x2). При построении использовать масштабирование. Диапазон значений выбрать самостоятельно. Организовать мигание.
Для выполнения следующего задания с помощью любого графического редактора создать три графических файла: прямоугольник, треугольник, круг.
Нарисовать следующую картинку: фон – желтый; в правом верхнем углу находится треугольник (зеленый); посредине экрана закрашенный прямоугольник (синий); из треугольника летит темно-серый закрашенный шарик, отскакивает от прямоугольника и летит в правый нижний угол. Рисунок подписать.
Выполнить практические задания 1-3.
Вариант №4.
Организовать движение какой-нибудь строки, по траектории: y=sin(x2)+tan(x). При построении использовать масштабирование. Диапазон значений выбрать самостоятельно. Организовать мигание.
Для выполнения следующего задания с помощью любого графического редактора создать три графических файла: прямоугольник, треугольник, круг.
Нарисовать следующую картинку: фон – белый; в правом верхнем углу находится треугольник (черный); посредине экрана закрашенный прямоугольник (темно-серый); из треугольника летит синий закрашенный шарик, отскакивает от прямоугольника и летит в левый верхний угол. Рисунок подписать.
Выполнить практические задания 1-3.
Вариант №5.
1.Организовать движение какой-нибудь строки, по траектории: y=sin(x3)/cos(x3). При построении использовать масштабирование. Диапазон значений выбрать самостоятельно. Организовать мигание.
Для выполнения следующего задания с помощью любого графического редактора создать три графических файла: прямоугольник, треугольник, круг.
Нарисовать следующую картинку: фон – темно-серый; в левом нижнем углу находится треугольник (зеленый); посредине экрана закрашенный прямоугольник (синий); из треугольника летит красно-синий закрашенный шарик, отскакивает от прямоугольника и летит в левый верхний угол. Рисунок подписать.
Выполнить практические задания 1-3.
Вариант №6.
1. Организовать движение какой-нибудь строки, по траектории: y=exp(x)+cos(x2). При построении использовать масштабирование. Диапазон значений выбрать самостоятельно. Организовать мигание.
Для выполнения следующего задания с помощью любого графического редактора создать три графических файла: прямоугольник, треугольник, круг.
Нарисовать следующую картинку: фон – светло-серый; в левом нижнем углу находится треугольник (зеленый); посредине экрана закрашенный прямоугольник (синий); из треугольника летит красный закрашенный шарик, отскакивает от прямоугольника и летит в правый нижний угол. Рисунок подписать.
Выполнить практические задания 1-3.
Вариант №7.
1. Организовать движение какой-нибудь строки, по траектории: y=sin(x2)+exp(x). При построении использовать масштабирование. Диапазон значений выбрать самостоятельно. Организовать мигание.
Для выполнения следующего задания с помощью любого графического редактора создать три графических файла: прямоугольник, треугольник, круг.
Нарисовать следующую картинку: фон – зеленый; в правом нижнем углу находится треугольник (ярко-красный); посредине экрана закрашенный прямоугольник (синий); из треугольника летит коричневый закрашенный шарик, отскакивает от прямоугольника и летит в левый нижний угол. Рисунок подписать.
Выполнить практические задания 1-3.
Вариант №8.
1. Организовать движение какой-нибудь строки, по траектории: y=exp(x2)*tan(x2). При построении использовать масштабирование. Диапазон значений выбрать самостоятельно. Организовать мигание.
Для выполнения следующего задания с помощью любого графического редактора создать три графических файла: прямоугольник, треугольник, круг.
Нарисовать следующую картинку: фон – ярко-красный; в правом нижнем углу находится треугольник (синий); посредине экрана закрашенный прямоугольник (коричневый); из треугольника летит зеленый закрашенный шарик, отскакивает от прямоугольника и летит в правый верхний угол. Рисунок подписать.
Выполнить практические задания 1-3.
Вариант №9.
1.Организовать движение какой-нибудь строки, по траектории: y=tan(x2)/exp(x2). При построении использовать масштабирование. Диапазон значений выбрать самостоятельно. Организовать мигание.
Для выполнения следующего задания с помощью любого графического редактора создать три графических файла: прямоугольник, треугольник, круг.
Нарисовать следующую картинку: фон – зеленый; в левом верхнем углу находится треугольник (синий); в левом нижнем углу закрашенный прямоугольник (коричневый); из треугольника летит красный закрашенный шарик, отскакивает от прямоугольника и летит в правый нижний угол. Рисунок подписать.
Выполнить практические задания 1-3.
Вариант №10.
1. Организовать движение какой-нибудь строки, по траектории: y=sin(x0.5)*tan(x0.5). При построении использовать масштабирование. Диапазон значений выбрать самостоятельно. Организовать мигание.
Для выполнения следующего задания с помощью любого графического редактора создать три графических файла: прямоугольник, треугольник, круг.
Нарисовать следующую картинку: фон – белый; в левом верхнем углу находится треугольник (красный); в правом верхнем углу закрашенный прямоугольник (синий); из треугольника летит зеленый закрашенный шарик, отскакивает от прямоугольника и летит в правый нижний угол. Рисунок подписать.
Выполнить практические задания 1-3.
Вариант №11.
1. Организовать движение какой-нибудь строки, по траектории: y=log(x2)+cos(x0.5). При построении использовать масштабирование. Диапазон значений выбрать самостоятельно. Организовать мигание.
Для выполнения следующего задания с помощью любого графического редактора создать три графических файла: прямоугольник, треугольник, круг.
Нарисовать следующую картинку: фон – красный; в правом верхнем углу находится треугольник (коричневый); в правом нижнем закрашенный прямоугольник (синий); из треугольника летит зеленый закрашенный шарик, отскакивает от прямоугольника и летит в левый нижний угол. Рисунок подписать.
Выполнить практические задания 1-3.
Вариант №12.
1. Организовать движение какой-нибудь строки, по траектории: y=sin(x0.5)*log(x2). При построении использовать масштабирование. Диапазон значений выбрать самостоятельно. Организовать мигание.
Для выполнения следующего задания с помощью любого графического редактора создать три графических файла: прямоугольник, треугольник, круг.
Нарисовать следующую картинку: фон – ярко-красный; в правом верхнем углу находится треугольник (синий); в левом верхнем углу закрашенный прямоугольник (коричневый); из треугольника летит зеленый закрашенный шарик, отскакивает от прямоугольника и летит в левый нижний угол. Рисунок подписать.
Выполнить практические задания 1-3.
Вариант №13.
1. Организовать движение какой-нибудь строки, по траектории: y=log(x2)+tan(x2). При построении использовать масштабирование. Диапазон значений выбрать самостоятельно. Организовать мигание.
Для выполнения следующего задания с помощью любого графического редактора создать три графических файла: прямоугольник, треугольник, круг.
Нарисовать следующую картинку: фон – сине-зеленый; в правом нижнем углу находится треугольник (коричневый); правом верхнем углу закрашенный прямоугольник (черный); из треугольника летит синий закрашенный шарик, отскакивает от прямоугольника и летит в левый верхний угол. Рисунок подписать.
Выполнить практические задания 1-3.
Вариант №14.
1. Организовать движение какой-нибудь строки, по траектории: y=exp(x2)+log(x0.5). При построении использовать масштабирование. Диапазон значений выбрать самостоятельно. Организовать мигание.
Для выполнения следующего задания с помощью любого графического редактора создать три графических файла: прямоугольник, треугольник, круг.
Нарисовать следующую картинку: фон – ярко-зеленый; в правом нижнем углу находится треугольник (красный); в левом нижнем углу закрашенный прямоугольник (синий); из треугольника летит коричневый закрашенный шарик, отскакивает от прямоугольника и летит в левый верхний угол. Рисунок подписать.
Выполнить практические задания 1-3.
Вариант №15.
1. Организовать движение какой-нибудь строки, по траектории: y=log(5+x2)/cos(x0.5). При построении использовать масштабирование. Диапазон значений выбрать самостоятельно. Организовать мигание.
Для выполнения следующего задания с помощью любого графического редактора создать три графических файла: прямоугольник, треугольник, круг.
Нарисовать следующую картинку: фон – желтый; в левом нижнем углу находится треугольник (синий); в правом нижнем углу закрашенный прямоугольник (красный); из треугольника летит красно-синий закрашенный шарик, отскакивает от прямоугольника и летит в правый верхний угол. Рисунок подписать.
Выполнить практические задания 1-3.