Page 1 of 1

CSS Page Transitions (Explorer)

Posted: Thu Jun 16, 2005 2:49 pm
by morelia
The page transitions allow to visualize similar effects to some changes of television images. Said otherwise, the invoked page doesn't appear directly but rather it goes preceded of effects of different type, such as breakups and other presentations.

The transitions are activated exclusively when you consents to the page of another **** or, in alternative, when you leaves the page to see another. Therefore, pressing the button "upgrades" of the navigator, any effect won't take place but rather it will be necessary to return to the previous page and to make **** again in the connection.

The transition effects can be given to the entrance (page-enter) or to the exit (page-exit) of page.

The code is inserted among the marks <HEAD> and it allows 23 different effects. In the examples that figure the value next "Page enter" it has been placed by what the effects take place when entering in the page. These are the effects to disposition:

Box in

Code: Select all

<META http-equiv="Page-Enter" CONTENT="RevealTrans(Duration=4,Transition=0)">
Box out

Code: Select all

<META http-equiv="Page-Enter" CONTENT="RevealTrans(Duration=4,Transition=1)">

Circle in

Code: Select all

<META http-equiv="Page-Enter" CONTENT="RevealTrans(Duration=4,Transition=2)">
Circle out

Code: Select all

<META http-equiv="Page-Enter" CONTENT="RevealTrans(Duration=4,Transition=3)">
Wipe up

Code: Select all

<META http-equiv="Page-Enter" CONTENT="RevealTrans(Duration=4,Transition=4)">
Wipe down

Code: Select all

<META http-equiv="Page-Enter" CONTENT="RevealTrans(Duration=4,Transition=5)">
Wipe right

Code: Select all

<META http-equiv="Page-Enter" CONTENT="RevealTrans(Duration=4,Transition=6)">
Wipe left

Code: Select all

<META http-equiv="Page-Enter" CONTENT="RevealTrans(Duration=4,Transition=7)">
Vertical blinds

Code: Select all

<META http-equiv="Page-Enter" CONTENT="RevealTrans(Duration=4,Transition=8)">
Horizontal blinds

Code: Select all

<META http-equiv="Page-Enter" CONTENT="RevealTrans(Duration=4,Transition=9)">
Checkerboard across

Code: Select all

<META http-equiv="Page-Enter" CONTENT="RevealTrans(Duration=4,Transition=10)">
Checkerboard down

Code: Select all

<META http-equiv="Page-Enter" CONTENT="RevealTrans(Duration=4,Transition=11)">
Random dissolve

Code: Select all

<META http-equiv="Page-Enter" CONTENT="RevealTrans(Duration=4,Transition=12)">
Split vertical in

Code: Select all

<META http-equiv="Page-Enter" CONTENT="RevealTrans(Duration=4,Transition=13)">
Split vertical out

Code: Select all

<META http-equiv="Page-Enter" CONTENT="RevealTrans(Duration=4,Transition=14)">
Split horizontal in

Code: Select all

<META http-equiv="Page-Enter" CONTENT="RevealTrans(Duration=4,Transition=15)">
Split horizontal out

Code: Select all

<META http-equiv="Page-Enter" CONTENT="RevealTrans(Duration=4,Transition=16)">
Strips left down

Code: Select all

<META http-equiv="Page-Enter" CONTENT="RevealTrans(Duration=4,Transition=17)">
Strips left up

Code: Select all

<META http-equiv="Page-Enter" CONTENT="RevealTrans(Duration=4,Transition=18)">
Strips right down

Code: Select all

<META http-equiv="Page-Enter" CONTENT="RevealTrans(Duration=4,Transition=19)">
Strips right up

Code: Select all

<META http-equiv="Page-Enter" CONTENT="RevealTrans(Duration=4,Transition=20)">
Random bars horizontal

Code: Select all

<META http-equiv="Page-Enter" CONTENT="RevealTrans(Duration=4,Transition=21)">
Random bars vertical

Code: Select all

<META http-equiv="Page-Enter" CONTENT="RevealTrans(Duration=4,Transition=22)">
Random

Code: Select all

<META http-equiv="Page-Enter" CONTENT="RevealTrans(Duration=4,Transition=23)">

If you want to see the effects in action, you can visit the site Nuke Bazaryou make **** in some links to see several effects. This place this in php (PHP-Nuke), but visualization of the effect is same in html

Notes:
· to obtain similar effects when leaving the coarse page to substitute "page-enter" with "page-exit."
· is not possible to use the transitions in pages divided in frames (marks), the reason is that the transition effects take place in the whole screen of the navigator and not in a part of this.

Posted: Fri Aug 26, 2005 7:44 am
by toychoq
thank you very much for these codes

give soem links where i can find some other ones

Posted: Fri Feb 24, 2006 12:43 pm
by kaos_frack
toychoq wrote:thank you very much for these codes

give soem links where i can find some other ones
isn't this enough for you
i don't think you can find something more than this

Hah

Posted: Mon Nov 20, 2006 6:31 pm
by Envoxia
Yeah, that should be enough. I was thinking, "ARE there any other codes?"

Posted: Mon Nov 20, 2006 9:22 pm
by Surreal
Interesting, but I think some of those codes would annoy users.

Posted: Tue Mar 20, 2007 4:05 am
by dexter
thanks you for sharing code...