Навчання JavaScript - Об’єкт Image
Ви зможете звертатися до нього, написавши document.myImage або document.images["myImage"].
Вгору
Тут завантажується зображенняimg1.gifта отримує ім'яmyImage. У наступному рядку попереднє зображенняimg1.gifзамінюється вже на нове -img2.gif:
При цьому нове зображення завжди отримує той самий розмір, що був у старого. І Ви вже не можете змінити розмір поля, в якому зображення розміщується.
Вгору
Але тепер зображення вже негайно виймається з кешу і з'являється на екрані. Таким чином, зараз ми керували запобіжним завантаженням зображення. Звичайно браузер повинен був до моменту запиту закінчити попереджувальне завантаження, щоб зображення було показано без затримки. Тому, якщо Ви повинні завантажити велику кількість зображень, то може мати місце затримка, оскільки браузер буде зайнятий завантаженням всіх картинок. Ви завжди повинні враховувати швидкість зв'язку з Інтернет - завантаження зображень не стане швидше, якщо користуватися щойно показаними командами. Ми лише намагаємося трохи раніше завантажити зображення – тому і користувач може побачити їх раніше. У результаті весь процес пройде більш гладко. Якщо у Вас є швидкий зв'язок з Інтернет, то Ви можете не зрозуміти, до чого вся ця розмова. Про яку затримку весь час каже цей хлопець? Прекрасно, але ще залишаються люди, які мають повільніший модем, ніж 14.4 (Ні, це не я. Я щойно замінив свій на 33.6, так.).
Вгору
Вихідний код цього прикладувиглядає так:
Цей скрипт поміщає всі зображення масивpics. Створює цей масив функція preload(), що викликається на самому початку. Виклик функції preload() виглядає просто як: Це означає, що скрипт повинен завантажити із сервера два зображення:img1f.gifтаimg1t.gif. Перше - це та картинка, яка буде представлена, поки курсор миші потрапляє у область зображення. Коли ж користувач поміщає курсор миші на зображення, з'являється друга картинка. При виклику функції preload() як перший аргумент ми вказуємо слово"link1"і тим самим задаємо на web-сторінці об'єкт Image, якому і будуть належати обидва попередньо завантажені зображення. Якщо Ви подивіться в нашому прикладі в розділі, то виявите зображення з тим же ім'ямlink1. Ми користуємося не порядковим номером, а саме ім'ям зображення для того, щоб мати можливість переставляти зображення на web-сторінці, не переписуючи при цьому сам скрипт. Обидві функції on() і off() викликаються за допомогою програм обробки подій onMouseOver та onMouseOut. Оскільки сам елемент image неспроможна відстежувати події MouseOver і MouseOut, ми повинні зробити цих зображеннях ще й посилання. Можна бачити, що функція on() повертає всі зображення, крім зазначеного, у вихідний стан. Робити це необхідно тому, що в іншому випадку виділеними можуть виявитися відразу декілька зображень (справа в тому, що подія MouseOut не буде зареєстрована, якщо користувач перемістить курсор із зображення відразу за межі вікна).
Вгору
')" value="Підказка" name=kk1 disabled />
2. Чи вірно чи не так наступне твердження: для закриває тег не обов'язковий?
Відповідь:
3.У якій властивість тега вказується шлях до зображення?
4. Як до зображення можна звернутися з JS?
document.getElementById("myImage"); document.myImage document.images["myImage"] document.images["img.gif"] будь-яким із перерахованих
5. Як змінити зображення з попереднього питання на файл img2.gif?
document.myImage.img="img2.gif"; document.myImage.src="img2.gif"; document.myImage.setImage("img2.gif"); document.myImage="img2.gif"; ніяким із перерахованих
Відповідь:
7. Як створити новий об'єкт Image?
Image(); newImage(); New Image (); createImage(); Img();
8. Правильне чи неправильне наступне твердження: чи застоїть код someImage.src="http://it-mans.narod.ru/24.gif"; завантажити браузером зображення?
Відповідь:
9. Які формати зображень використовуються в Інтернеті?
Відповідь:
Ви набрали балів із 100 можливих
Оцінка:
Вгору