I would like to have two or more pages that display differently when the orientation of the device changes. At first I tried using

1. $("#mapPage").bind('orientationchange', oriChange);

That didn't fire an event and so I wound up using this:

1. $(window).bind("pageshow orientationchange resize", function(){
2.     if ($("#mapPage").is(".ui-page-active")) { 
3.         oriChange();
4.     }
5. });
6. $(window).bind("pageshow orientationchange", function(){
7.     if ($("#profilePage").is(".ui-page-active")) { 
8.         $("#chart").html("");       
9.         $mt.getProfile();
10.     }
11. });

This does what I want it to but I was wondering if there is a better way of achieving this result. It just seems to me that binding the window twice is not good practice.