Названия виджетов и описание функционала

Варианты заданий к курсовой работе по курсу

“Web-технологии и Web-дизайн”

Таблица 1

Варианты заданий

Номер варианта Номера виджетов, подлежащих разработке Номера диалогов, подлежащих разработке Анимированный эффект для виджетов и диалогов
1, 15, 11, 5, 20, 6 1, 5, 2
2, 14, 12, 4, 19, 7 3, 2, 1
3, 13, 13, 3, 18, 8 2, 4, 3
4, 12, 14, 2, 17, 9 4, 3, 5
5, 11, 15, 1, 16, 10 1, 5, 4
6, 10, 16, 1, 15, 11 5, 2, 1
7, 9, 17, 2, 14, 12 2, 1, 3
8, 8, 18, 3, 13, 13 4, 3, 2
9, 7, 19, 4, 12, 14 3, 5, 4
10, 6, 20, 5, 11, 15 5, 4, 1
11, 5, 20, 6, 10, 16 2, 1, 5
12, 4, 19, 7, 9, 17 1, 3, 2
13, 3, 18, 8, 8, 18 3, 2, 4
14, 2, 17, 9, 7, 19 5, 4, 3
15, 1, 16, 10, 6, 20 4, 1, 5
16, 1, 15, 11, 5, 20 1, 5, 2
17, 2, 14, 12, 4, 19 3, 2, 1
18, 3, 13, 13, 3, 18 2, 4, 3
19, 4, 12, 14, 2, 17 4, 3, 5
20, 5, 11, 15, 1, 16 1, 5, 4
20, 6, 10, 16, 1, 15 5, 2, 1
19, 7, 9, 17, 2, 14 2, 1, 3
18, 8, 8, 18, 3, 13 4, 3, 2
17, 9, 7, 19, 4, 12 3, 5, 4
16, 10, 6, 20, 5, 11 5, 4, 1


Виджеты для разработки

Все виджеты, которые требуется создать в согласовании с вариантом задания должны быть на сто процентов работоспособны, кроссбраузерны и интегрированы в формы Названия виджетов и описание функционала страничек разрабатываемого веб-сайта.

Таблица 2

Наименования виджетов и описание функционала

Заглавие Пример реализации (либо описание)
Поле выбора времени При нажатии на кнопку (32х32) рядом с ней раскрывается всплывающее окно размером 128х128 пикселей. В этом окне отображается изображение циферблата часов с 2-мя стрелками. Юзер может крутить стрелки мышкой Названия виджетов и описание функционала. При всем этом если крутится минутная стрелка, часовая должна сдвигаться так, чтоб ее угол соответствовал положению минутной стрелки. Секунды не учесть. При отпускании стрелки время в цифровой форме должно записываться в кнопку (к примеру, 13:15).
Поле выбора даты Обычный календарь. При нажатии на кнопку с изображением календаря (32х32), раскрывается всплывающее окно, состоящее из Названия виджетов и описание функционала 2-ух частей. В высшей части находятся кнопки выбора месяца и года, также наименования текущего месяца и года. В нижней – календарь избранного месяца. Юзер может выбирать месяц, год, при всем этом календарь текущего месяца должен обновляться. Дальше юзер может избрать число. При наведении на кнопки и числа месяца они Названия виджетов и описание функционала должны подсвечиваться. При выборе даты она должна записываться в поле ввода на страничке в цифровом виде. Пример реализации: http://popuka.net
Полоса прокрутки Необычная полоса прокрутки (горизонтальная либо вертикальная) для контейнера div, содержимое которого не помещается в отведенный размер. При перемещении полосы по экрану содержимое контейнера должно прокручиваться. Длина Названия виджетов и описание функционала полосы должна зависеть от соотношения размеров прокручиваемого документа и контейнера. Пример реализации http://ozon.ru. (Вначале полоса прокрутки тут невидима, она плавненько возникает на страничке с описание продукта в рубриках Личности, Другие издания, Продукты)
Поле выбора файла При нажатии на кнопку с иконкой файла (32х32) раскрывается стандартное диалоговое окно выбора Названия виджетов и описание функционала файла. Эффект анимации для данного виджета не требуется. Пример реализации: http://gmail.com (прикрепление файла к отправляемому письму)
Поле выбора года Поле, схожее на стандартный SELECT. При нажатии на это поле раскрывается всплывающее окно, содержащее перечень избираемых годов. При наведении курсора мыши на избираемый год он Названия виджетов и описание функционала должен подсвечиваться. Високосные года должны отмечаться другим цветом. Пример реализации показан на снимке экрана:
Поле выбора месяца Поле, схожее на стандартный SELECT. При нажатии на это поле раскрывается всплывающее окно, содержащее перечень избираемых месяцев. Отличие от стандартного элемента SELECT состоит в том, что наименования месяцев размещены по два (либо Названия виджетов и описание функционала по три) в одной строке. При наведении курсора мыши на избираемый месяц он должен подсвечиваться. Пример реализации показан на снимке экрана:
Поле выбора денька Поле, схожее на стандартный SELECT. При нажатии на это поле раскрывается всплывающее окно, содержащее перечень избираемых дней. Количество дней по дефлоту 31, проверка на 30, 29, 28 дней в месяце не требуется Названия виджетов и описание функционала. Допускается последний, 31 денек, вывести понизу в виде отдельной строчки. Другие деньки вывести по 5 либо 6 шт. в строке. При наведении курсора мыши на избираемый денек он должен подсвечиваться. Пример реализации см. выше (виджеты № 5,6)
Поле выбора типа файла Поле, схожее на стандартный SELECT. При нажатии на это поле Названия виджетов и описание функционала раскрывается всплывающее окно, содержащее перечень избираемых типов файла. Отличие от стандартного элемента SELECT в том, что для каждого избираемого типа файла можно задать иконку. При наведении курсора мыши на избираемый тип файла он должен подсвечиваться. Пример реализации показан на снимке экрана:
Группа радиокнопок Необычная группа радиокнопок, по функционалу схожая на обыденную Названия виджетов и описание функционала. При клике на кнопку она должна перебегать в активное состояние, другие кнопки при всем этом должны переводиться в изначальное состояние. При наведении на одну из кнопок, она должна подсвечиваться. Пример реализации показан на снимке экрана: (Поглядеть пример в действии можно на веб-сайте http://www.lingvocenter.ru/, нажав Названия виджетов и описание функционала кнопку пройти тестирование справа)
Группа кнопок Необычная группа обыденных кнопок. Отличие от предшествующего виджета (см. вариант 9) в том, что при нажатии на кнопку ее состояние инвертируется. Несколько кнопок могут иметь одно и тоже состояние. При наведении на одну из кнопок, она должна подсвечиваться. Пример реализации показан на снимке экрана:
Блок установки Названия виджетов и описание функционала численного значения Представляет собой текстовое поле с 4-мя клавишами слева либо справа. Нажатие на одну из их приводит к повышению числа на 1. Нажатие на другую – к его уменьшению. Оставшиеся 2 кнопки позволяют наращивать и уменьшать число на 10 соответственно. При наведении на кнопку она должна подсвечиваться. Допускается и конкретный ввод Названия виджетов и описание функционала чисел. Анимированные эффекты не употребляются. Пример реализации:
Ползунок Ползунок необычной формы со стандартными функциями. Анимированные эффекты не употребляются. Пример реализации показан на снимке экрана:
Табконтрол Панель управления вкладками (табами) на случайное число (более 2-ух) табов. При выборе соответственного таба его содержимое должно показываться под панелью. Анимированные эффекты Названия виджетов и описание функционала не употребляются. Пример реализации показан на снимке экрана: Рабочий пример (в действии) можно поглядеть на веб-сайте http://popuka.net
Перечень одиночного выбора Необычное поле, являющееся аналогом стандартного элемента SELECT. В отличие от виджетов №5-№8 (см. выше) может также содержать стандартную полосу прокрутки. Пример реализации показан на снимках экрана выше (см. примеры Названия виджетов и описание функционала виджетов №5-№8):
Вертикальный табконтрол Вертикальный вариант табконтрола (см. виджет №13). В отличие от горизонтального вкладки (табы) размещаются слева. Справа располагается управляемая страничка. Анимированные эффекты не употребляются.
Тумблер на 3 положения Одиночный клик по виджету приводит к смене его состояния с положения 1 в положение 2, с положения 2 в положение3 и с положения Названия виджетов и описание функционала 3 вспять в положение 1. Анимированные эффекты не употребляются. Зрительно виджет может смотреться как тумблер (см. рис.)
Контекстное меню Меню, открывающееся при нажатии ПРАВОЙ кнопки мыши. При всем этом стандартное меню браузера раскрываться не должно. Пример реализации: http://joewalnes.github.com/jquery-simple-context-menu/example.html
Радиальный ползунок Радиальный вариант ползунка Названия виджетов и описание функционала (см. виджет №12). Нередко употребляется в плеерах для регулировки громкости, тембра и т.п. Анимированные эффекты не употребляются.
Виртуальная русско-латинская клавиатура При нажатии на кнопку с изображением клавиатуры(32x32) рядом с ней раскрывается всплывающее окно, содержащее набор кнопок по числу букв латинского и российского алфавита. При наведении на каждую кнопку Названия виджетов и описание функционала она должна подсвечиваться. Нажатие на кнопку приводит к добавлению соответственного знака к текстовому полю. Должны поддерживаться также кнопки CapsLock, Shift, Ins, Del. Кнопка Enter употребляется для окончания ввода, при нажатии на нее клавиатура запирается.
Виртуальная цифровая клавиатура При нажатии на кнопку с изображением клавиатуры(32x32) рядом с Названия виджетов и описание функционала ней раскрывается всплывающее окно, содержащее набор кнопок по числу цифр. При наведении на каждую кнопку она должна подсвечиваться. Нажатие на кнопку приводит к добавлению соответственной числа к текстовому полю. Кнопка Enter употребляется для окончания ввода, при нажатии на нее клавиатура запирается.


Диалоги

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

Таблица 3


nazvaniya-i-chisla-kart-taro-2-glava.html
nazvaniya-i-chisla-kart-taro-8-glava.html
nazvaniya-metodov-teorii-kommunikacii.html