Разработка веб-ресурса с использованием HTML, CSS, JavaScript, PHP. Применение базовых технологий для создания фотоархива в веб-интерфейсе. Захаркина В.В. - 13 стр.

UptoLike

ВУЗ: 

СПбГУ | Санкт-Петербург

Составители: 

Рубрика: 

24
//имена классов CSS для фотографии и
//сопровождающего текста
//(примеры задания стилей приведены выше):
photoCSSClass = 'largePhoto';
photoTextCSSClass = 'photoText';
//--------------------------------------------
//Поскольку предполагается вывод фотографий с
//подписями, в клиентском варианте
//программирования удобно определить
//массив строк, содержащих имя графического
//файла (без расширения) и текст подписи.
//Имя файла и текст в строке массива разделены
//неким редко встречающимся символом: в нашем
//случае это символ |
//Описание массива в этом случае
удобно хранить
//в отдельном файле, присоединяя его к
//документу, реализующему показ фотоархива.
//Но сейчас мы определим массив в основном
//тексте сценария:
photoArr = new Array
(
'l07|Чтения по древнерусской литературе',
'l08|1982 г. Петрозаводск. На улице города',
'l09|1982 г. Петрозаводск. Д.С. Лихачев'
// и так далее: перечисляем строковые
//элементы массива
);
//--------------------------------------------
//Определяем
функцию вывода полномасштабной
//фотографии. Она будет служить обработчиком
//события click для миниатюр. Функция вызывается
//как значение атрибута onClick,задаваемого
//для каждой миниатюры с соответствующим
//значением аргумента
25
//---------------------------------------------
function showPhoto(n)
//Выводит n-ую полномасштабную фотографию с
//сопровождающим текстом в фрейм, имя которого
//задано в глобальной переменной photoFrameName.
//Адреса фотографий и тексты подписей хранятся
//в массиве photoArr
{
//выделяем из n-ого элемента массива photoArr[]
//имя файла фотографии и текст подписи и
//сохраняем в переменных photoName и photoText
var w = photoArr[n].split('|');
var photoName = w[0];
var photoText = w[1];
//формируем
содержимое документа фрейма с
//именем photoFrameName
with ( parent[photoFrameName].document )
{
open();
write('<html><head>' +
'<meta http-equiv="Content-Type"
content="text/html;
charset=windows-1251">' +
'</head><body>');
write('<div class="
photoCSSClass">' +
'<img src="' +
photoDir+photoName+photoExt +
'"><br></div>'+
'<div class="
photoTextCSSClass">' +
photoText +
'</div>');

Страницы