【Pixelate()】モザイクをかける

filterプロパティのPixelate()では、ピクセルを拡大・ぼかし・フェードして画像やテキストにモザイクをかけたような表示にする事ができます。 モザイクの四角のサイズはパラメータで設定します。

書式などについて詳しくはfilterを参照して下さい。

書式

  • filter:progid:DXImageTransform.Microsoft.Pixelate(★) ……… モザイク表示する(IE5.5以上)

★:MaxSquare=四角のサイズ

MaxSquare=四角のサイズ
モザイクの四角のサイズを2~50の範囲で指定します。(初期値50)

使用した時の例

.sample1 img {
  filter:progid:DXImageTransform.Microsoft.Pixelate(MaxSquare=20);
}
<p>フィルタを適用していない画像<br />
  <img src="image.jpg" alt="" width="130" height="87">
</p>
<p class="sample1">Pixelate(MaxSquare=20)を適用した画像<br />
  <img src="image.jpg" alt="" width="130" height="87">
</p>

ブラウザ上の表示例

フィルタを適用していない画像

Pixelate(MaxSquare=20)を適用した画像

対応ブラウザなどのデータ

プロパティ 独自拡張
対応ブラウザ Internet Explorer5.5~
※IE10以降は未対応

関連情報