Reveal transitions eller direkt översatt till svenska; "avslöjande övergångar" kan användas vid byte från en websida till en annan och ger övergångseffekter liknande de som finns i tex PowerPoint. Du bestämmer själv om övergången ska ske när besökaren kommer till sidan eller lämnar den genom att ange "page-enter" eller "page-exit". Transitions och även andra effekter/filter (läs mer i guiden CSS- effekter ») är DHTML-funktioner som bara fungerar i senare versioner av webläsare. Exemplen nedan fungerar enligt Microsoft själva i Internet Explorer 4 och senare versioner. Funktionen aktiveras genom att du anger inom märket <META> vad som ska ske när sidan hämtas eller lämnas. Exemplet nedan ger vertikala persienner (vertical blinds) när besökaren hämtar sidan (page-enter):
Längden på effekten anger du med ett värde för "duration" där ett lägre värde ger en snabbare övergång och ett högre värde en längre övergång. Prova dig fram till ett lämpligt värde för just den effekt du valt. Ett för lågt värde kan ge en "ryckig" övergång och ett för högt värde kan göra att besökaren tröttnar på att vänta på nästa sida. Du kan ange att sidövergången ska ske både när sidan hämtas (page-enter) och när den lämnas (page-exit) och även ange olika effekter för "page-enter" och "page-exit". I exemplet nedan används samma sidövergång både när sidan hämtas och lämnas:
Du kan välja mellan 23 övergångseffekter för "revealtrans" som identifieras med nummer och dessutom finns 1 för "blendtrans" som tonar in sidan. Klicka på namnen för att se exempel och koden du lägger inom <HEAD>:
| 0 = Box in » |
| <meta http-equiv="page-enter" content="revealtrans (duration=4, transition=0)"> |
| 1 = Box out » |
| <meta http-equiv="page-enter" content="revealtrans (duration=4, transition=1)"> |
| 2 = Circle in » |
| <meta http-equiv="page-enter" content="revealtrans (duration=4, transition=2)"> |
| 3 = Circle out » |
| <meta http-equiv="page-enter" content="revealtrans (duration=4, transition=3)"> |
| 4 = Wipe up » |
| <meta http-equiv="page-enter" content="revealtrans (duration=4, transition=4)"> |
| 5 = Wipe down » |
| <meta http-equiv="page-enter" content="revealtrans (duration=4, transition=5)"> |
| 6 = Wipe right » |
| <meta http-equiv="page-enter" content="revealtrans (duration=4, transition=6)"> |
| 7 = Wipe left » |
| <meta http-equiv="page-enter" content="revealtrans (duration=4, transition=7)"> |
| 8 = Vertical blinds » |
| <meta http-equiv="page-enter" content="revealtrans (duration=4, transition=8)"> |
| 9 = Horisontal blinds » |
| <meta http-equiv="page-enter" content="revealtrans (duration=4, transition=9)"> |
| 10 = Checkerboard across » |
| <meta http-equiv="page-enter" content="revealtrans (duration=4, transition=10)"> |
| 11 = Checkerboard down » |
| <meta http-equiv="page-enter" content="revealtrans (duration=4, transition=11)"> |
| 12 = Random dissolve » |
| <meta http-equiv="page-enter" content="revealtrans (duration=4, transition=12)"> |
| 13 = Split vertical in » |
| <meta http-equiv="page-enter" content="revealtrans (duration=4, transition=13)"> |
| 14 = Split vertical out » |
| <meta http-equiv="page-enter" content="revealtrans (duration=4, transition=14)"> |
| 15 = Split horisontal in » |
| <meta http-equiv="page-enter" content="revealtrans (duration=4, transition=15)"> |
| 16 = Split horisontal out » |
| <meta http-equiv="page-enter" content="revealtrans (duration=4, transition=16)"> |
| 17 = Strips left down » |
| <meta http-equiv="page-enter" content="revealtrans (duration=4, transition=17)"> |
| 18 = Strips left up » |
| <meta http-equiv="page-enter" content="revealtrans (duration=4, transition=18)"> |
| 19 = Strips right down » |
| <meta http-equiv="page-enter" content="revealtrans (duration=4, transition=19)"> |
| 20 = Strips right up » |
| <meta http-equiv="page-enter" content="revealtrans (duration=4, transition=20)"> |
| 21 = Random bars horisontal » |
| <meta http-equiv="page-enter" content="revealtrans (duration=4, transition=21)"> |
| 22 = Random bars vertical » |
| <meta http-equiv="page-enter" content="revealtrans (duration=4, transition=22)"> |
| 23 = Random » (slumpvis blandning av alla ovan) |
| <meta http-equiv="page-enter" content="revealtrans (duration=4, transition=23)"> |
| blendtrans = Blend » (tonar in sidan) |
| <meta http-equiv="page-enter" content="blendtrans(duration=4)"> |