До елементів сторінки можна застосувати фільтри для отримання різноманітних мультимедійних ефектів. Фільтри поділяються на статичні і динамічні. Статичний фільтр дає вже готовий вигляд елемента. Динамічний перехід створює анімаційний ефект.
До елементів body, img, input, table, , th, textarea фільтри застосовуються безумовно. Елементи div і span повинна бути абсолютно позиціоновані або мати в параметрі style визначення висоти і ширини. Фільтри не можна застосовувати до заголовків, елементів iframe, select, option, , em.
Фільтри задаються властивістю Filter: имяФильтра(параметри). До одного елемента можна застосувати відразу декілька фільтрів.
Текстові фільтри
Наведу опис деяких фільтрів, які звичайно застосовуються до тексту.
Тінь
Застосовується для того, щоб зробити текст об'ємним.
shadow
(color="колір", direction=напрямок)
де колір тіні задається кодовим словом або шістнадцяткове значення а напрямок падіння тіні задається в градусах щодо 12-ти годин.
Наведу опис деяких фільтрів, які звичайно застосовуються до тексту.
Відкинута тінь dropshadow
Застосовується з тією ж метою, за текстом з'являється його силует.
dropshadow
(color="колір", offx=зсув, offy=зсув)
де зсув задає відступ силуету у точках по горизонталі і вертикалі. Якщо обидва значення позитивні, то силует зміщується вправо і вниз.
Світіння glow
Створює навколо символів світиться ореол.
glow
(color="колір", strength=інтенсивність)
де інтенсивність задає ширину світіння в пікселях.
Універсальні фільтри
Наступні фільтри застосовуються до тексту, так і до зображень.
Маска mask
mask
(color="колір")
де колір заливає прозорі області об'єкта, а непрозорі стають білими.
Розмиття blur
(direction=напрям, strength=інтенсивність, add={true|false})
де параметр add задає або скасовує додавання початкового варіанту об'єкта в відфільтроване.
Хвильовий спотворення wave
wave
(freq=частота, phase=фаза, lightstrength=освітлення,
strength=інтенсивність, add={true|false})
де частота задає кількість піків хвилі, а фаза - відсотки від синусоїди.
Дзеркальне відображення fliph
та flipv
Фільтр fliph
створює відображення по горизонталі, flipv
- по вертикалі. Обидва фільтра без параметрів.
Це дача!
Прозорість alpha
Застосовується для створення ефекту прозорості всього зображення або його частин.
alpha
(непрозорість=прозорість, style=стиль[, startx=X1, starty=Y1, finishx=X2, finishy=Y2])
де прозорість визначається у відсотках, стиль має визначені значення
0
- фільтр застосовується рівномірно по всьому зображенню;
<2/CODE> - прозорість змінюється від центру еліпса, вписаного у кордону, до країв;
3
- прозорість змінюється від центру зображення до країв;
1
- уздовж відрізка прямий, заданої координатами початку (X1,Y1SUB>) і кінця (X2,Y2).
Сподіваюся, не треба пояснювати, який стиль на якому малюнку застосовувався.
Якщо ви не бачите ефекти, значить браузер не підтримує ці css стилі.
Дата додавання: 2010-12-27 |
Переглядів: 4745 |