Компьютерная графика и web-программирование

Стр 1 из 2Следующая ⇒

13. 05. 2020

" Компьютерная графика и web-программирование"

этап совершенствования 5 год обучения

Тема: jQuery. Таймеры.

Цель: формирование представления о методахjQuery для обработки событий по времени.

Образовательные задачи: научить обрабатывать события с помощью jQuery с временной задержкой.

Развивающие задачи: развивать умение использовать методы jQuery.

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

Ход занятия

Теоретическая часть

До сих пор мы использовали для методов jQueryследующую форму записи:

$( " div" ). fadeOut();

Где $(" div" ) – выбор элемента на странице. А. fadeOut() – применение к выбранному элементу метода jQuery. Например, в данном случае мы выбрали все элементы divи скрыли их.

В том случае, если к выбранному элементу нужно применить несколько методов, их можно записать «цепочкой» - через точку. Например:

$( " div" ). fadeOut(). fadeIn()

Такой набор методов сначала скроет все элементы div, а потом отобразит.

Метод delay()

Для создания паузы между событиями используется метод. delay() (в качестве параметров указывается количество миллисекунд)

Например такой код уберет элемент или элементы div через 5 секунд (5000 миллисекунд):

$( " div" ). delay(5000). fadeOut();

Если указать не общий селектор div, а конкретный idили class, то можно создать всплывающие подсказки для элементов сайта, появляющуюся форму для вопросов и так далее.

Кроме метода delay() мы можем использовать таймеры из JavaScript (jQuery – это библиотека JSи мы может использовать чистый JS-код вместе с конструкциями из jQuery).

12 Следующая ⇒