Фильтр Blur
Фильтр Blur размывает содержание элемента как будто он находится не в фокусе.
Для браузеров IE 5.5-7 фильтры можно подключать в CSS документ с помощью CSS свойства filter. В IE8+ для этого предусмотрено вендорное CSS свойство -ms-filter. Причем из-за особенностей синтаксического анализатора IE8 их порядок имеет значение: -ms-filter должен идти первым.
Синтаксис
div {
-ms-filter:"progid:DXImageTransform.Microsoft.Blur()";
filter:progid:DXImageTransform.Microsoft.Blur();
}
Параметры отделяются друг от друга запятой. Параметр состоит из двух частей: имени параметра и его значения, разделенных знаком равно. Значение параметра может быть взято в кавычки.
Параметры фильтра
| Параметр | Описание | Возможные значения | Значение по умолчанию |
|---|---|---|---|
| enabled | флаг, управляющий фильтром |
|
true |
| makeShadow | флаг, указывающий, что элемент нужно отобразить как тень |
|
false |
| pixelRadius | определяет радиус непрозрачной обрасти в пикселях вокруг каждого пикселя к которому применяется фильтр (радиус размытия) |
|
2 |
| shadowOpacity | определяет прозрачность тени, если элемент отображается как тень (makeShadow=true) |
Значения больше 1.0 или меньше 0.0 приравниваются к 0.75 (значение по умолчанию) |
0.75 |
Примеры
Элемент с радиусом размытия 10px:
div {
-ms-filter:"progid:DXImageTransform.Microsoft.Blur(pixelRadius=10)";
filter:progid:DXImageTransform.Microsoft.Blur(pixelRadius=10);
}
Элемент в виде полупрозрачной тени с радиусом размытия 5px .
div {
-ms-filter:"progid:DXImageTransform.Microsoft.Blur(makeShadow=true, pixelRadius=5, shadowOpacity=0.5)";
filter:progid:DXImageTransform.Microsoft.Blur(makeShadow=true, pixelRadius=5, shadowOpacity=0.5);
}
Показать комментарии