Як зробити підказку до заслання і малюнку, управління видимістю об'єкта, зміна змісту блоку

Як зробити підказку до заслання і малюнку, управління видимістю об'єкта, зміна змісту блоку

Облиште. Хоча, мені особисто цікавий сам питання застосування подібних ефектів на веб-сторінці в принципі, так би мовити. Або вже не цікавий.


перше
Найпростіше і, часто, оптимальне рішення # 151; звичайні спливаючі підказки. Для малюнків вони задаються # 151; ALT = "текст пояснення" Альтернативний текст для малюнка на той випадок, якщо він з невідомої нам причини не завантажиться або відключено відображення малюнків, для текстових та голосових броузерів.
Для посилань, та й для всіх майже елементів можна застосувати TITLE = "текст пояснення" Для малюнків подібний метод теж застосуємо. Вписуємо все це добро прямо в тег елемента і насолоджуємося результатом # 151; розмір мінімальний, якщо пояснення сделанно коротко і "у справі", то все цілком прочитується за час видимості підказки. У Нетскейп четверте версій титли не працює. Так, до речі, такі підказки працюють в меню розділів вгорі даної сторінки.

Для прикладу підведіть миша до наведеного вище опису і дивіться в рядок статусу. Як бачите, після відведення мишки в статусі залишається текст "за замовчуванням", можна там прописати назву сайту, наприклад. На самому початку, в БОДИ, рекомендую поставити onload = "window.defaultStatus = 'Текст за замовчуванням'" тоді на вашій сторінці подібна "погань" буде "стирчати" з самого моменту завантаження сторінки.

dom = (document.getElementById)? true: false
ns4 = (document.layers)? true: false
ie4 = (document.all ! Dom)? true: false

function init () <
if (dom) block = document.getElementById ( "blockDiv"). style
if (ns4) block = document.blockDiv
if (ie4) block = blockDiv.style
>

function showObject (obj) <
if (ns4) obj.visibility = "show"
else obj.visibility = "visible"
>

function hideObject (obj) <
if (ns4) obj.visibility = "hide"
else obj.visibility = "hidden"
>

А сама поява об'єкта буде управлятися так:

Сам об'єкт буде "обзиватися" так:


пояснення

Працює і в Нетскейп четверте версій. Тільки ось все це прописувати, всі ці скрипти.


варіант четвертий
Милий моєму серцю, так би мовити. ) Про те, що Нетскейп четверті можна назвати "живими трупами", я вже говорив, виходячи з цього можна все зробити дуже просто з використанням стильових специфікацій. Приклад поки наводити не буду, поясню все "на пальцях". Не плутати з "Рамсі". )

Основи всього нашого майбутнього "винаходи" можна знайти в розділі про блокової структурою. Що ми будемо робити # 151; ми створюємо необхідний набір блоків в описі класів яких, крім розташування, розмірів і всього іншого вказуємо visibility: hidden; Ми отримуємо якийсь набір невидимих ​​спочатку блоків, що містять потрібну нам інформацію. Тепер просто створюємо ще один клас, в якому вказуємо тільки visibility: show; # 151; більше нічого! Тепер дивимося або СТВОРЕННЯ МЕНЮ ЗА П'ЯТЬ ХВИЛИН в розділі про блоки або окрему статтю про зміни класів в розділі про загальний застосуванні стилів. Нам просто треба змінити клас невидимого блоку на той клас, в якому у нас вказана видимість. Так як крім visibility: show; той клас не містить більше ніяких описів стилів, то і змінюватися буде тільки властивість visibility. Всі інші стильові опису залишаться без змін # 151; розташування, кольору, все інше, що ви там накопичилося. ) Якщо всі верстви на одному місці повинні знаходитися, можна їм призначити різний ЗЕТ-ІНДЕКС. Як бачите, все знову просто, навіть елементарно. У Ватсон підете. )

Моє опис виготовлення меню, що випадає багато обізвали "перекрутити", але використовують із задоволенням. ) Цілком можливо, що і цей варіант можна віднести до подібних збочень. Скриптів теж мінімум, одна строчка. Якщо дане опис викличе інтерес і виникнуть складності з реалізацією, зобов'язуюсь зробити працюючий приклад для наочності.


п'ятий варіант
Наводжу код для початку:

if (document.getElementById)
document.getElementById ( "boxdescription"). innerHTML = html
else
boxdescription.innerHTML = html
>

if (document.getElementById)
document.getElementById ( "boxdescription").
innerHTML = '\Текст за замовчуванням \'
(Попередні два рядки
пишуться в одну! перенесення зроблений
для зручності розміщення!)

else
boxdescription.innerHTML = '\
Текст за замовчуванням \
'
>

Цей скрипт "заштовхуємо" в Хеад



Текс за замовчуванням

Це той блок, в який будуть виводитися наші підказки

А так робимо виведення підказки при наведенні миша на посилання. Увага звернути стоїть на boxdescription в скрипті і в імені блоку, назвати можна як завгодно, тільки не заплутатися. В даному прикладі использованно властивість innerHTML, воно дозволяє виводити не тільки текст, а й теги. Для прикладу використаний тег ЦЕНТЕР. Зверніть увагу на зворотний слеш перед відкриває дужкою тега. Даний приклад буде працювати в Експлорер і Нетскейп шостому. Для четвертих Нетскейп можна теж зробити подібний ефект, але код сильно ускладнитися і надійність його. Ну, не дуже, так скажемо.

Схожі статті