Справочник по CSS : Тематический указатель : Справочник по свойствам и атрибутам : Фильтр : filter

смотрим также

Материал из Справочник Web-языков

Перейти к: навигация, поиск


Содержание

Атрибут filter | Свойство filter

Задает фильтр или набор фильтров, применяемых к объекту.

Синтаксис

HTML { -ms-filter : sFilter }
Скрипты [ sFilter = ] object.style.filter

Используемые значения

sFilter
Строка, которая устанавливает или принимает одно из следующих значений.
filtertype1 (parameter1, parameter2,...) Любой из списка фильтров, перечисленных в Visual Filters and Transitions Reference.
filtertype2 (parameter1, parameter2,...) Любой из списка фильтров, перечисленных в Visual Filters and Transitions Reference.

Свойство не имеет значения по умолчанию. Атрибут Каскадных таблиц стилей (CSS) не наследуется.

Замечания

Атрибут -ms-filter для Internet Explorer 8 - это расширение CSS и может использоваться также как filter в режиме IE8. Выражение для фильтра должно заключаться в одинарные или двойные кавычки. Множественные значения должны разделяться запятой (,).

Объект должен иметь размещение фильтров для визуализации. Это легко сделать назначив элементу заданную высоту и/или длину. Однако, существуют и еще несколько других свойств, которые могут быть использованы для размещения элемента. Смотрите свойство hasLayout для получения более подробной информации об этом.

Фильтр тени может быть применен для объекта типа img, путем установки фильтра на родительский контейнер изображения.

Механизм фильтров открытый и наращиваемый. Он дает вам возможность разрабатывать и добавлять фильтры позднее.

Невозможно применение фильтров на платформе Macintosh.

Примеры

Этот пример показывает как использовать атрибут -ms-filter в Internet Explorer 8

-ms-filter: 'progid:DXImageTransform.Microsoft.MotionBlur(strength=50), progid:DXImageTransform.Microsoft.BasicImage(mirror=1)';

Этот пример показывает как использовать стили для установки фильтра на изображение.

<img style="filter:progid:DXImageTransform.Microsoft.MotionBlur(strength=50)
    progid:DXImageTransform.Microsoft.BasicImage(mirror=1)"
    src="/workshop/samples/author/dhtml/graphics/cone.jpg"
    height="80px" width="80px" alt="cone">

Следующий пример показывают как использовать скрипты для установки фильтра на изображение.

<script type="text/javascript">
function doFilter ()
{ 
    filterFrom.filters.item(0).Apply();
    // 12 is the dissolve filter.  
    filterFrom.filters.item(0).Transition=12;
    imageFrom.style.visibility = "hidden";
    filterTo.style.visibility = ""; 
    filterFrom.filters.item(0).play(14); 
}
</script>
</head>

<body>

<p>Click on the image to start the filter.</p>
// Call the function.
<div id="filterFrom" onclick="doFilter()" 
    style="position: absolute; 
        width: 200px; 
        height: 250px; 
        background-color: white; 
        filter: revealTrans()">
<img id="imageFrom" 
    style="position: absolute; 
        top: 20px; 
        left: 20px;" 
    src="sphere.jpg" 
    alt="sphere">
<div id="filterTo" 
    style="position: absolute; 
        width: 200px; 
        height: 250px; 
        top: 20px; 
        left: 20px; 
        background: white; 
        visibility: hidden;">
</div>
</div>

</body>

Ссылки на источники

http://msdn.microsoft.com/en-us/library/ms530752(VS.85).aspx

Добавить страницу в закладки:
РАЗРЕШАЕТСЯ перепечатывать и копировать информацию ТОЛЬКО ПРИ РАЗМЕЩЕНИИ ссылки на оригинал!
(<A href="http://www.spravkaweb.ru/">Справочник Web-языков</A>)
другие проекты
Rambler\'s Top100 Индекс цитирования