Page Transitions with Internet Explorer

If you are browsing the web using Internet Explorer then you will have noticed that the previous page didn't just disappear to be replaced by the current page as usually happens when you go to a new web page. Instead the page was slowly transformed from the previous page into the current page. You will see a similar effect when you exit this page.

What you are seeing in each case is one of the twenty three different page transitions that Microsoft have provided within the Internet Explorer browsers. Other browsers don't support page transitions so if you are using any other browser you probably are wondering what I am talking about because the page transition didn't look any different from normal. One of the advantages of this particular feature is that it doesn't cause any problems with other browsers.

The effect itself is created by placing one or two meta tags in the head section of the page. These tags define the transition to take place when the page is entered and also when the page is exited. In each case you need to specify the duration of the effect in seconds and which of the 23 effects to use. For example this page contains the following tags:

 <meta http-equiv="Page-Enter"
<meta http-equiv="Page-Exit"

One thing to watch out for is that these need to be the first two http-equiv tags in order for them to both function properly. When I first created this page to test the effect I placed these tags below the http-equiv tag defining the character set to be used and the entry effect refused to work.

The effects that you can choose from are:

  1. Box in
  2. Box Out
  3. Circle In
  4. Circle Out
  5. Wipe Up
  6. Wipe Down
  7. Wipe Right
  8. Wipe Left
  9. Vertical Blinds
  10. Horizontal Blinds
  11. Chequerboard Across
  12. Chequerboard Down
  13. Random Dissolve
  14. Split Vertical In
  15. Split Vertical Out
  16. Split Horizontal In
  17. Split Horizontal Out
  18. Strips Left Down
  19. Strips Left Up
  20. Strips Right Down
  21. Strips Right Up
  22. Random Bars Horizontal
  23. Random Bars Vertical

You may want to experiment with specifying these different values into the meta tags in your page in order to decide which one to use. Alternatively you can do what I did and specify 23 which selects a different effect randomly from the list each time it is activated.


This article written by Stephen Chapman, Felgall Pty Ltd.

go to top

FaceBook Follow
Twitter Follow