Javascript.RU

Доступ к объекту filters

В браузерах Internet Explorer начиная с 4-й версии доступен объект filters, который дает доступ к управлению фильтрами. Но большее количество разновидности фильтров было добавлено в Internet Explorer версии 5.5.
С помощью фильтров можно создавать различные визуальные эффекты. Применение этих фильтров может осуществляться как с помощью CSS, так и с помощью javascript.
Полный список всех фильтров доступен тут, где демонстрируется их работа (работает только в InternetExplorer).
Изначальной идеей создания этих фильтров было - облегчение работы для пользователей, т.к. они не требуют вмешательства скриптов, и то, что фильтры можно интегрировать в стиль или класс элемента, т.к. они используют синтаксис CSS.

Пример использования фильтров (работает только в Internet Explorer)
Фильтр alpha устанавливает прозрачность элемента на 20% с помощью свойства opacity

<img src="http://javascript.ru/forum/images/ca_serenity/misc/logo.gif" style="filter:progid:DXImageTransform.Microsoft.Alpha(opacity=20)">

Фильтр Blur размывает элемент с помощью свойства PixelRadius

<img src="http://javascript.ru/forum/images/ca_serenity/misc/logo.gif" style="filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius=4)">

Пример использования фильтров в javascript

// через объект style
elem.style.filter ="progid:DXImageTransform.Microsoft.Alpha(opacity=20)";

// или через объект filters
elem.filters.alpha.opacity = 20;

Главной особенностью объекта filters в javascript, то, что он доступен только для тех элементов, которые имеют родительский узел!

Следующий пример продемонстрирует эту особенность.

var div = document.createElement('div');
alert(div.filters) // результат:  ошибка "Член группы не найден" и сценарий обрывается

var elem = document.getElementById('elemId');
alert(elem.filters) // результат: [object]
+1

Автор: Grundiss (не зарегистрирован), дата: 13 октября, 2010 - 04:43
#permalink

во втором сценарии у вас

var div ...

а следом

typeof obj.filters

Это только здесь опечатка или и в самом коде?
Кроме того фильтры должны лежать внутри styles, не так ли?

obj.style.filter

Автор: I-zone, дата: 13 октября, 2010 - 11:34
#permalink

В IE не текстовые ноды имеют объект для управления фильтрами . filters
> А втором сценарии проверяемый элемент был создан, но не включен в DOM.
Не совсем так. Просто для того, чтобы манипулировать объектом фильтра, у элемента должен быть родитель, а находиться на странице ему не обязательно...

window.onload=function(){
   var container=document.createElement("DIV");
   var clildNode=document.createElement("SPAN");
   try{
      alert("Доступ к свойству "+!!clildNode.filters);
   }catch(e){
      alert("Доступ к свойству false. "+e.description);
   }
   container.appendChild(clildNode);
   alert("Повторный доступ к свойству "+!!clildNode.filters);
}

Вообще-то, для таких тем есть форум.
Может хватит засорять главную страницу сайта?
Или офформить стоило по-аккуратней, что ли.


Автор: HelpeR, дата: 13 октября, 2010 - 13:00
#permalink

Думаю блог лучше подошел бы для этого случая, думаю кому нибудь пригодится! Ведь я тут не поднимаю вопрос, а показываю интересную ситуацию! Не думаю что каждый знает про это!


Автор: HelpeR, дата: 13 октября, 2010 - 12:57
#permalink

Да это тут была опечатка. Исправил!


Автор: Илья Кантор, дата: 13 октября, 2010 - 15:07
#permalink

Просьба - аккуратнее с заголовком. "Член группы не найден" - как бы вообще непонятно и не при чем. Поправил его.

Также просьба обновить сообщение, сделать его более понятным, что, причем, зачем, и как может быть полезно читателям.


Автор: Гость (не зарегистрирован), дата: 16 апреля, 2022 - 02:30
#permalink

Автор: Гость (не зарегистрирован), дата: 16 апреля, 2022 - 12:16
#permalink

Отправить комментарий

Приветствуются комментарии:
  • Полезные.
  • Дополняющие прочитанное.
  • Вопросы по прочитанному. Именно по прочитанному, чтобы ответ на него помог другим разобраться в предмете статьи. Другие вопросы могут быть удалены.
    Для остальных вопросов и обсуждений есть форум.
P.S. Лучшее "спасибо" - не комментарий, как все здорово, а рекомендация или ссылка на статью.
Содержание этого поля является приватным и не предназначено к показу.
  • Адреса страниц и электронной почты автоматически преобразуются в ссылки.
  • Разрешены HTML-таги: <strike> <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd> <u> <i> <b> <pre> <img> <abbr> <blockquote> <h1> <h2> <h3> <h4> <h5> <p> <div> <span> <sub> <sup>
  • Строки и параграфы переносятся автоматически.
  • Текстовые смайлы будут заменены на графические.

Подробнее о форматировании

CAPTCHA
Антиспам
5 + 1 =
Введите результат. Например, для 1+3, введите 4.
 
Поиск по сайту
Другие записи этого автора
HelpeR
Содержание

Учебник javascript

Основные элементы языка

Сундучок с инструментами

Интерфейсы

Все об AJAX

Оптимизация

Разное

Дерево всех статей

Популярные таги
Последние комментарии
Последние темы на форуме
Forum