JavaScript/DHTML Tutorial

Filters: blur()

CSS:
style="filter:blur(strength=15, direction=270, add=true)"

DOM:
object.style.filter="blur(strength=15, direction=270, add=true)"

Macaws

strength:	px
direction:	°
add:

Figure 11-12. Application of blur() filter.

The blur() filter gives the impression of motion by bluring the element a certain number of pixels in a certain direction. The general formats for the blur() filter are shown below.

CSS:
filter:blur(strength=n, direction=n, add=true|false)

DOM:
object.style.filter="blur(strength=n, direction=n, add=true|false)"

Figure 11-13. General formats for blur() filter.

strength is the number of pixels to extend the blur.

direction sets the angle of the blurred image relative to the original image.

add indicates whether the original image is added to the blurred image.