Filters: flipH() - flipV()

CSS:
style="filter:flipH()"
DOM:
object.style.filter="flipH()"


Macaws
Flip:


Figure 11-20. Application of flipH() and flipV() filters.

The flipH() and flipV() filters reverse the element horizontally and vertically, respectively. No additional parameters are required. The general formats for the flipH() and flipV() filters are shown below.

CSS:
filter:flipH()
filter:flipV()

DOM:
object.style.filter="flipH()"
object.style.filter="flipV()"
Figure 11-21. General formats for flipH() and flipV() filters.

These filters can be applied directly to a graphic or text element. In the above example, they are applied to the container division to apply to both contained elements.

<div id="DIV" style="filter:flipH()">
  <img src="Macaws.jpg"/><br/>
  <span style="font-family:verdana; font-weight:bold; font-size:14pt; 
    color:red">Macaws</span>
</div>
Listing 11-9. Code to apply flipH() filter.

Note that the filters apply only to the original orientation of the element. That is, after the filter is applied, it cannot be reapplied to reverse the element back to its original horizontal or vertical orientation.