9186

Работа с готовыми плагинами Jquery

Лабораторная работа

Информатика, кибернетика и программирование

Работа с готовыми плагинами Jquery Цель: научиться подключать и адаптировать под свои нужды готовые плагины Jquery Теоретические сведения: Плагин - независимо компилируемый программный модуль, динамически подключаемый к основной программе, предназна...

Русский

2013-02-25

645.94 KB

21 чел.

Работа с готовыми плагинами Jquery

Цель: научиться подключать и адаптировать под свои нужды готовые плагины Jquery

Теоретические сведения:

Плагин - независимо компилируемый программный модуль, динамически подключаемый к основной программе, предназначенный для расширения и/или использования её возможностей. Также может переводиться как «модуль». Плагины обычно выполняются в виде разделяемых библиотек.

Рассмотрим пример создания карусели изображений с использованием плагина jCarousel (http://sorgalla.com/jcarousel/)

  1.  Подключаем библиотеку Jquery, плагин карусели (jcarousel), а также стандартный файл скина для карусели (skin.css)

  1.  Создаем html-структуру для галереи изображений:

  1.  Инициализируем работу карусели:


  1.  Исправляем css-файл, для отображения необходимого внешнего вида галереи изображений.

  1.  При необходимости изменяем свойства плагина jcarousel для корректной работы с заданными условиями.

Полный список свойств можно посмотреть:

http://sorgalla.com/projects/jcarousel/

Индивидуальные задания:

1

Сделать вертикальную карусель изображений с отображением 5 элементов и автоматической прокруткой на 1 элемент каждые 8 секунд (кнопок вперед назад быть не должно)

2

Сделать горизонтальную карусель для нескольких поговорок,

Кавычки должны быть кнопками смены поговорок.

3

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

Пример галереи изображен на рисунке

4

Сделать галерею изображений с помощью плагина thickbox (http://thickbox.net/).

Внешний вид: отображается 8 изображений по клику на каждое из них в pop-up окне открывается увеличенное изображение.

5

Сделать галерею изображений с помощью плагина fancyBox (http://fancybox.net/).

Внешний вид: отображается 5 изображений по клику на каждое из них в pop-up окне открывается увеличенное изображение.

6

Соединить карусель и галерею изображений jcarousel + thickbox

Внешний вид: отображается 3 элемента, кнопки влево-вправо, по клику на которые карусель вращается. По клику на любое изображение в pop-up окне открывается увеличенное изображение.

7

Сделать слайдер изображений с помощью плагина NivoSlider (http://nivo.dev7studios.com/)

Внешний вид представлен на рисунке:

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

8

Сделать таблицу группы (взять в деканате), внешний вид:

Номер по порядку

Фамилия

Имя

Рейтинг за 3 года обучения

С помощью плагина tablesorter (http://tablesorter.com) сделать сортировку по каждой колонке таблицы (по возрастанию/по убыванию)


 

А также другие работы, которые могут Вас заинтересовать

63163. Принципи здорового способу життя 20.74 KB
  Мета: Ознайомити учнів з поняттям €œздоровий спосіб життя продовжувати формувати в учнів активну мотивацію щодо дбайливого ставлення до власного здоров’я. Виховувати прагнення берегти своє здоров’я зважаючи на його цінність і значимість.
63165. Память как познавательный процесс 106 KB
  Память - это процессы организации и сохранения прошлого опыта, делающего возможным его повторное использование в деятельности или возвращение в сферу сознания. Память связывает прошлое человека с его настоящим и будущим и является важнейшей познавательной функцией
63166. Право як навчальний предмет. Мета, завдання, особливості курсу 22.77 KB
  Обладнання й матеріали: Конституція України Конвенція ООН про права дитини Загальна декларація прав людини плакати з висловами відомих людей про права людини. Мир прогрес права людини ці три цілі нерозривно повязані неможливо досягнути...
63167. Вступ до історії стародавнього світу 28.52 KB
  Мета: Сформувати уявлення про хронологічні межі та предмет історії стародавнього світу дати визначення понять стародавній світ історичне джерело археологічні памятки розвивати навички відліку часу до н. Після цього уроку учні зможуть...
63168. СЛОВ’ЯНИ ПІД ЧАС ВЕЛИКОГО ПЕРЕСЕЛЕННЯ НАРОДІВ 31.51 KB
  Мета: визначити територію, заняття й суспільні відносини союзів словянських племен, що стали базою, на якій виникла держава — Київська Русь; розвивати в учнів навички роботи з першоджерелами, історичною картою, блок-таблицями, схемами...
63169. Правознавство. Життя за правилами 21.63 KB
  Мета: познайомити учнів з правилами суспільного життя з ознаками правової норми сформувати розуміння необхідності дотримання законів і правил виховувати в учнів активну громадянську позицію.
63170. Виникнення людини. Залюднення Європи 27.2 KB
  Мета: дати уявлення про передумови виникнення людини; розглянути процес розселення пралюдей на території Європи; показати роль праці у виділенні людини з тваринного світу.
63171. СТАНОВЛЕННЯ ДЕРЖАВИ З ЦЕНТРОМ У КИЄВІ 42.97 KB
  Рюрик помер у Новгороді залишивши малолітнього сина Ігоря на руках його вихователя Олега. Виступ учня Правління Олега. Він вважав що Аскольд став жертвою змови київських прибічників язичництва: Убивство Аскольдове найбільш вірогідне що хрещення тому причиною було...