Плавне поява і зникання об'єкта на javascript> блог інтернет технологій

Роблячи проект замовнику, я натрапив на одну проблему. Потрібно було перетворити блоки і посилання. Наводячи курсор на об'єкт, той повинен був плавно змінювати opacity до 1. Прибираючи курсор з блоку, той повинен був повернути початковий рівень прозорості.


style = "opacity: 0.1; filter: alpha (opacity = 10);">
Ось тестовий блок


Тепер я поясню вам все що там є.

OnMouseOver. Виникає при наведенні курсору миші на елемент. В даному випадку, ми включаємо функцію Show, задану в скрипті (про це пізніше).

OnMouseOut. Виникає при переміщення покажчика миші за межі об'єкта. Тут ми включаємо функцію Hide. Замедте, ми включаємо, а не виключаємо Show.

( 'Block', 1) і ( 'block', 0.1). Ці параметри відносяться до onmouseover і onmouseout відповідно. 'Block' - це ID, який повинен обов'язково бути вказано в div (в даному прикладі). '1' і '0.1' - це параметр opacity до значення якого буде збільшуватися або зменшуватися прозорість.

  • Style. Тут ми вказуємо тільки прозорість, а всі інші стилі пропишіть в #block. Тут opacity луше вказувати таке, яке задано в OnMouseOut.

    • От і все. Об'єкт був зроблений. Якщо потрібно, то можу пояснити принцип дії скрипта.

    Цей скрипт універсальний, тому що не має ніяких уподобань до певного ID. Так що його можна спокой використовувати і для інших випадках. Наприклад для посилань. Ось код посилань:
    href = ""


    style = "opacity: 0.1; filter: alpha (opacity = 10);"> 123
    Головне пам'ятати, що при зміні в об'єкті ID'a, то його доведеться змінити ще в двох місцях. Про це я писав.