filter - Pixelate() (Filter/visual)

An effect that simulates the pixellation achieved when lowering the display resolution of an image.

Availability:

JScript - 5.5
Internet Explorer - 5.5
Object properties:Enabled, Duration, MaxSquare, Percent, status
Object methods:apply(), play(), stop()
Supported by objects:A, ACRONYM, ADDRESS, B, BDO, BIG BLOCKQUOTE, body, BUTTON, CAPTION, CENTER, CITE, CODE, custom, DD, DFN, DIR, DIV, DL, DT, EM, FIELDSET, FONT, FORM, FRAME, FRAMESET, Hn, I, IFRAME, IMG, INPUT, INS, KBD, LABEL, LEGEND, LI, MARQUEE, MENU, NOBR, OL, P, PLAINTEXT, PRE, Q, RT, RUBY, runtimeStyle, S, SAMP, SMALL, SPAN, STRIKE, STRONG, style, SUB, SUP, TABLE, TD, TEXTAREA, TH, TT, U, UL, VAR, XMP

Although this may be used as a static filter, it can also be used with the duration value, Apply(), Stop() and Play() methods to control a transition effect.

The effect retains the current image size but takes groups of pixels and averages them and replaces the group with the average value. The effect is similar to that achieved by reducing the image and expanding it again without applying interpolation.

This can useful for greeking out some content that you don't want to display. For example, you can obscure facial features or car number plates in this way.

The following properties can be applied to this filter when it is used as a static visual effect (other transition control properties are not useful in this context):

The example demonstrates the pixelation filter applied as a static effect.

Example code:

   <HTML>
   <HEAD>
   </HEAD>
   <BODY>
   Normal--&gt;
   <IMG ID="NORMAL" SRC="./Logo150.gif">
   Filtered--&gt;
   <IMG ID="MYIMAGE" SRC="./Logo150.gif">
   <BR>
   <SCRIPT>
   myFilter = "progid:DXImageTransform.Microsoft.Pixelate(maxsquare=10)";
   document.all.MYIMAGE.style.filter = myFilter;
   </SCRIPT>
   </BODY>
   </HTML>

See also:Filter object, style.filter

PropertyJavaScriptJScriptNIEOperaNESECMADOMCSSHTMLNotes
Enabled n/a5.5 5.5 n/a5.5 5.5 n/a n/a n/a n/a n/a n/a-
Duration n/a5.5 5.5 n/a5.5 5.5 n/a n/a n/a n/a n/a n/a-
MaxSquare n/a5.5 5.5 n/a5.5 5.5 n/a n/a n/a n/a n/a n/a-
Percent n/a5.5 5.5 n/a5.5 5.5 n/a n/a n/a n/a n/a n/a-
status n/a5.5 5.5 n/a5.5 5.5 n/a n/a n/a n/a n/a n/a-

MethodJavaScriptJScriptNIEOperaNESECMADOMCSSHTMLNotes
apply() n/a5.5 5.5 n/a5.5 5.5 n/a n/a n/a n/a n/a n/a-
play() n/a5.5 5.5 n/a5.5 5.5 n/a n/a n/a n/a n/a n/a-
stop() n/a5.5 5.5 n/a5.5 5.5 n/a n/a n/a n/a n/a n/a-