Webpage filtering effect-Summary of webpage filtering effect

The webpage transition effect can increase the beautiful and dynamic status of the website. This article collects all the webpage transition effects and implementation code on the IE browser for your reference:

First, if you want to apply excessive effects on a webpage, you must first enable the webpage transition. By default, the transition is enabled. If you want to manually enable the transition, you only need to select the Internet option: advanced-browse-enable page transition.

After the transition effect is enabled, the following describes the application transition effect.

The transition effect code should add a special mate tag to the head of the webpage. The following is the collection effect code:

Webpage transition:

<Metahttp-equiv = "Page-Enter" content = "progid: DXImageTransform. Microsoft. randomdissolve (duration = 2)">

Webpage exit transition:

<Metahttp-equiv = "Page-Exit" content = "progid: DXImageTransform. Microsoft. randomdissolve (duration = 2)">

Next, let's list the effects:

Blinds)

Code

<Metahttp-equiv = "Page-Enter" content = "progid: DXImageTransform. Microsoft. blinds (duration = 2)">

<Metahttp-equiv = "Page-Exit" content = "progid: DXImageTransform. Microsoft. blinds (duration = 2)">

Properties: bands (default = 10), direction (default = "down"), duration (nodefault)

Barn (cleanup)

Code

<Metahttp-equiv = "Page-Enter" content = "progid: DXImageTransform. Microsoft. Barn (duration = 2)">

<Metahttp-equiv = "Page-Exit" content = "progid: DXImageTransform. Microsoft. Barn (duration = 2)">

Properties: duration, motion, orientation (default = "vertical ")

Checkerboard (numerous small cells)

Code

<Metahttp-equiv = "Page-Enter" content = "progid: DXImageTransform. Microsoft. checkerboard (duration = 2)">

<Metahttp-equiv = "Page-Exit" content = "progid: DXImageTransform. Microsoft. checkerboard (duration = 2)">

Properties: direction (default = "right"), squaresx (default = 12), squaresy (default = 10)

Fade (fade in and out)

Code

<Metahttp-equiv = "Page-Enter" content = "progid: DXImageTransform. Microsoft. Fade (duration = 2)">

<Metahttp-equiv = "Page-Exit" content = "progid: DXImageTransform. Microsoft. Fade (duration = 2)">

Properties: duration, overlap (default = 1.0)

Gradientwipe (gradient cleaning)

Code

<Metahttp-equiv = "Page-Enter" content = "progid: DXImageTransform. Microsoft. gradientwipe (duration = 2)">

<Metahttp-equiv = "Page-Exit" content = "progid: DXImageTransform. Microsoft. gradientwipe (duration = 2)">

Properties: duration, gradientsize (default = 0.25), motion

Inset (spread from one corner)

Code

<Metahttp-equiv = "Page-Enter" content = "progid: DXImageTransform. Microsoft. inset (duration = 2)">

<Metahttp-equiv = "Page-Exit" content = "progid: DXImageTransform. Microsoft. inset (duration = 2)">

Properties: Duration

Iris (Cross spread)

Code

<Metahttp-equiv = "Page-Enter" content = "progid: DXImageTransform. Microsoft. Iris (duration = 2)">

<Metahttp-equiv = "Page-Exit" content = "progid: DXImageTransform. Microsoft. Iris (duration = 2)">

Properties: duration, irisstyle (default = "plus"), motion

Pixelate (shake out cool)

Code

<Metahttp-equiv = "Page-Enter" content = "progid: DXImageTransform. Microsoft. pixelate (duration = 2)">

<Metahttp-equiv = "Page-Exit" content = "progid: DXImageTransform. Microsoft. pixelate (duration = 2)">

Properties: duration, maxsquare (default = 25)

Radialwipe (spiral extension)

Code

<Metahttp-equiv = "Page-Enter" content = "progid: DXImageTransform. Microsoft. radialwipe (duration = 2)">

<Metahttp-equiv = "Page-Exit" content = "progid: DXImageTransform. Microsoft. radialwipe (duration = 2)">

Properties: duration, wipestyle (default = "Clock ")

Randombars (line mask)

Code

<Metahttp-equiv = "Page-Enter" content = "progid: DXImageTransform. Microsoft. randombars (duration = 2)">

<Metahttp-equiv = "Page-Exit" content = "progid: DXImageTransform. Microsoft. randombars (duration = 2)">

Properties: duration, orientation (default = "horizontal ")

Randomdissolve (pixel mask cool)

Code

<Metahttp-equiv = "Page-Enter" content = "progid: DXImageTransform. Microsoft. randomdissolve (duration = 2)">

<Metahttp-equiv = "Page-Exit" content = "progid: DXImageTransform. Microsoft. randomdissolve (duration = 2)">

Properties: Duration

Slide)

Code

<Metahttp-equiv = "Page-Enter" content = "progid: DXImageTransform. Microsoft. Slide (duration = 2)">

<Metahttp-equiv = "Page-Exit" content = "progid: DXImageTransform. Microsoft. Slide (duration = 2)">

Properties: bands (default = 1), duration, slidestyle (default = "slide ")

Spiral (cool)

Code

<Metahttp-equiv = "Page-Enter" content = "progid: DXImageTransform. Microsoft. Spiral (duration = 2)">

<Metahttp-equiv = "Page-Exit" content = "progid: DXImageTransform. Microsoft. Spiral (duration = 2)">

Properties: duration, gridsizex (default = 16), gridsizey (default = 16)

Stretch (opening effect on both sides)

Code

<Metahttp-equiv = "Page-Enter" content = "progid: DXImageTransform. Microsoft. Stretch (duration = 2)">

<Metahttp-equiv = "Page-Exit" content = "progid: DXImageTransform. Microsoft. Stretch (duration = 2)">

Properties: duration, stretchstyle (default = "Spin ")

Strips)

Code

<Metahttp-equiv = "Page-Enter" content = "progid: DXImageTransform. Microsoft. strips (duration = 2)">

<Metahttp-equiv = "Page-Exit" content = "progid: DXImageTransform. Microsoft. strips (duration = 2)">

Properties: duration, motion

Wheel (Cross rotation opening)

Code

<Metahttp-equiv = "Page-Enter" content = "progid: DXImageTransform. Microsoft. Wheel (duration = 2)">

<Metahttp-equiv = "Page-Exit" content = "progid: DXImageTransform. Microsoft. Wheel (duration = 2)">

Properties: duration, spokes (default = 4)

Zigzag (Z-shaped expansion)

Code

<Metahttp-equiv = "Page-Enter" content = "progid: DXImageTransform. Microsoft. Zigzag (duration = 2)">

<Metahttp-equiv = "Page-Exit" content = "progid: DXImageTransform. Microsoft. Zigzag (duration = 2)">

Properties: duration, gridsizex, gridsizey

Note that all of the above transition effects are only valid in IE browser.

From the web page production Tutorial: http://www.web2bar.cn/Article/3190.aspx