I have a page that uses supersized as a full screen background. Depending on the size of the screen width, a different background image is displayed. However, when I rotate my iPad from portrait to landscape (or vice versa) i.e. from a 768 to a 1024 pixel screen width the page needs to be refreshed before the alternative background can be displayed.
Is there any way I can force the iPad to refresh the page when the screen is rotated, perhaps using Javascript?
This is the supersized code:
<script type="text/javascript">
jQuery(function($){
var image_filename = 'GA.jpg';
if($(window).width() < 1024) {
image_filename = '_people.jpg';
}
$.supersized({
slides : [ {image : 'images/'+image_filename, title : 'Image Credit: none'} ]
});
});
</script>