.
Меняем текст заголовка через DOM
Вот пример того, как менять текст заголовка с помощью DOM. Давайте
создадим новый HTML-документ dom.html со следующим кодом:
Изучаем DOM
"main-heading"
>Привет, мир!
Привет, мир!
"https://code.jquery.com/jquery-2.1.0.js"
>
Src
— source —
источник
150
Часть II. Продвинутый JavaScript
, вызывая jQuery-метод append.
С помощью jQuery измените текст элемента
h1, чтобы вместо
"Привет, мир!" там было "Мои друзья". Используйте метод
hide и метод fadeIn, чтобы имена плавно возникали на экране.
Теперь измените созданные вами элементы
p, добавив после
каждого имени слово
"лучший!". Подсказка: если найти сразу
все элементы
p с помощью $("p"), метод append можно вызвать
для них всех разом.
#2. Мигающий заголовок
Как с помощью
fadeOut и fadeIn сделать так, чтобы заголовок
мигнул пять раз с интервалом в секунду? Как сделать это в цикле
for? А теперь измените цикл, чтобы заголовок появлялся
и исчезал в первый раз за секунду, потом за две, потом за три
и т. д.
#3. Отложенная анимация
Для задержки анимации можно воспользоваться методом
delay.
С помощью
delay, fadeOut и fadeIn заставьте какой-нибудь
элемент плавно исчезнуть, а затем, через пять секунд, снова
проявиться.
#4. Метод fadeTo()
Поэкспериментируйте с методом
fadeTo. Первый его аргу-
мент — число миллисекунд, как и у прочих методов анимации,
а второй — число от 0 до 1. Что произойдет, если запустить сле-
дующий код?
$
(
"h1"
).fadeTo(2000, 0.5);
Как думаете, что делает второй аргумент? Попробуйте разные
его значения в диапазоне от 0 до 1, чтобы выяснить, зачем он
нужен.
Delay
—
отложить
156
10
Достарыңызбен бөлісу: |