filter - Wave() (Filter/visual)

A visual filter for creating ripple effects.

Availability:

JScript - 3.0
Internet Explorer - 4.0
Object properties:Enabled, Add, Freq, LightStrength, Phase, Strength
Supported by objects: A , ACRONYM , ADDRESS , B , BDO , BIG , BLOCKQUOTE , body , BUTTON , CAPTION , CENTER , CITE , CODE , custom , DD , DEL , DFN , DIR , DIV , DL , DT , EM , FIELDSET , FONT , FORM , FRAME , 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

This visual filter applies a rippled distortion effect to the filtered element. The effect is applied only along the vertical axis.

The following properties can be applied to this filter:

The Enabled property was introduced at version 5.5 of the MSIE browser to provide a consistent interface for activating and disabling filters by assigning the true or false value to it.

Like the MotionBlur() filter, the add property specifies whether the original unmodified image should be placed over the rippled copy. A value of 1 adds the original while a value of 0 displayed only the rippled copy.

The freq property specifies the number of waves to be applied as the distorting effect is rendered.

The lightStrength property indicates the intensity of the light playing on the rippled surface with a value in the range 0 to 100.

The phase property defines the percentage offset for the sine wave curve in the range 0 to 100 which corresponds to an angular phase offset of 0 to 359 degrees.

The strength property defines the wave rendering effect's intensity. This value must be between 0 and 255 with 0 providing no distortion and 255 causing a gross ripple effect.

The example shows this ripple effect being applied to an image.

Warnings:

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.Wave(freq=6, lightstrength=90, phase=60, add=1, strength=10)";
   
   document.all.MYIMAGE.style.filter = myFilter;
   </SCRIPT>
   </BODY>
   </HTML>

See also:Filter object, style.filter

PropertyJavaScriptJScriptNIEOperaNESECMADOMCSSHTMLNotes
Enabled n/a3.0 3.0 n/a4.0 4.0 n/a n/a n/a n/a n/a n/a-
Add n/a3.0 3.0 n/a4.0 4.0 n/a n/a n/a n/a n/a n/aWarning
Freq n/a3.0 3.0 n/a4.0 4.0 n/a n/a n/a n/a n/a n/aWarning
LightStrength n/a3.0 3.0 n/a4.0 4.0 n/a n/a n/a n/a n/a n/aWarning
Phase n/a3.0 3.0 n/a4.0 4.0 n/a n/a n/a n/a n/a n/aWarning
Strength n/a3.0 3.0 n/a4.0 4.0 n/a n/a n/a n/a n/a n/aWarning