Разработка информационно-справочного ресурса культурно-развлекательного центра "Мистик"
Дипломная работа - Компьютеры, программирование
Другие дипломы по предмету Компьютеры, программирование
е углы позволят создать следующее оформление для него при помощи CSS кода:
#menu {: 960px;: 60px auto;: 1px solid #222;color: #111;image: -moz-linear-gradient(#444, #111);image: -webkit-gradient(linear, left top, left bottom, from(#444), to(#111));image: -webkit-linear-gradient(#444, #111);image: -o-linear-gradient(#444, #111);image: -ms-linear-gradient(#444, #111);image: linear-gradient(#444, #111);
moz-border-radius: 6px;
webkit-border-radius: 6px;radius: 6px;
moz-box-shadow: 0 1px 1px #777;
webkit-box-shadow: 0 1px 1px #777;
box-shadow: 0 1px 1px #777;}
Рисунок 5.6 - Округление краев
Дальнейшим этапом стало отключение обтекания при помощи кода:
#menu:before,
#menu:after {content: "";display: table;}
#menu:after { clear: both;}
#menu {zoom:1;}
Internet Explorer 6 версии требует дополнительного кода для работы меню:
$(function() { if ($.browser.msie && $.browser.version.substr(0,1)<7)
{ $(li).has(ul).mouseover(function(){
$(this).children(ul).css(visibility,visible);
}).mouseout(function(){
$(this).children(ul).css(visibility,hidden);})}});
Последующий код создания меню приведен в приложении
Рисунок 5.7 - Навигационное меню
Открытие изображений на новом слое происходит посредством подключенного скрипта shutterset.
">
где href это ссылка на оригинальное изображение, а src это ссылка на его уменьшенную копию, для уменьшения трафика.
Рисунок 5.8 - Открытое изображение скриптом shutterset
Объединение фотографий в галереи происходит путем написания параметров в class "shutterset". В квадратных скобках указывается номер галереи
">
Рисунок 5.9 - Объединение фотографий в галереи
Карта создается путем использования сервиса yandex.map и последующей интеграции кода на ресурс.
">
.
Рисунок 5.10 - Интеграция карты от сервиса Yandex.maps
После основного текста страницы присутствует кнопки на популярные социальные сети интернета. Кнопки управляются при помощи скрипта share42.js.
">
">
Рисунок 5.11 - Кнопка Поделиться в социальных сетях.
.2 Описание интерфейса
Работа с сайтом разделяется для 2 типов пользователей: администратор, незарегистрированный пользователь
Работа с ресурсом начинается со страницы входа. Страница входа на ресурс отличается от основного дизайна сайта. Страница входа включает в себя эмблему КРК Мистик, при нажатии на которую выполняется скрипт с анимацией. А так же страница включает основные пункты меню, для быстрого доступа к необходимой информации.
Рисунок 5.12 - Страница входа на ресурс
Рисунок 5.13 - Анимация входа на ресурс
Рисунок 5.14 - Главная страница ресурса
Ресурс имеет 2х колоночный стандарт, схема которого приведена на рисунке. Ресурс содержит шапку, навигационное меню, левую колонку, центральную колонку и подвал.
-шапка;2-навигационное меню; 3-левая колонка; 4-центральная колонка; 5-подвал
Рисунок 5.15 - Схематичное изображение дизайна ресурса
Шапка ресурса. Шапка ресурса содержит слайдшоу, которое управляется скриптом.
Рисунок 5.16 - Шапка ресурса
Левая колонка. Левая колонка представлена на всех страница ресурса, содержит изображения на предстоящие важные события в КРК Мистик, при нажатии на которые происходит их увеличение в этом же окне при помощи скрипта.
Рисунок 5.17 - Левая колонка ресурса
Центральная колонка. Центральная колонка главной страницы содержит основные сведения о деятельности КРК Мистик в виде текстовой информации, изображений, ссылок, переход по которым происходит нажатием левой кнопки мыши. Центральная колонка имеет полупрозрачный фон белого цвета. В конце центральной колонки расположены ссылки на самые известные социальные сети для рекомендации ресурса другим пользователям.
Рисунок 5.18 - Центральная колонка ресурса
Рисунок 5.19 - Кнопка Поделиться в социальных сетях.
Навигационное меню. Навигационное меню содержит ссылки на страницы ресурса. Меню имеет максимальный второй уровень вложенности, но возможно его расширения до 3. Навигационное меню управляется с помощью скрипта.
Рисунок 5.20 - Навигационное меню ресурса.
Подвал ресурса. Подвал ресурса остается неизменным для всех страниц ресурса и содержит адрес КРК Мистик и контактный телефон.
Рисунок 5.21 - Подвал ресурса.
6. ТЕСТИРОВАНИЕ РАБОТЫ РЕСУРСА И КОНТРОЛЬНЫЙ
ПРИМЕР РАБОТЫ
Тестирование - это процесс многократного выполнения программы iелью обнаружения ошибок.
Цель тестирования - выявление как можно бол