Uhg, this really is bad bad UI design and it goes against the past 15 years of user experience but:
Code:
<style type="text/css">
.background-switch{
position:absolute;
top:0;
left:0;
z-index:3;
width:100%;
height:100%;
}
.wrapper{
position:absolute;
top:0;
left:50%;
z-index:6;
margin-left:-480px;
width:960px;
}
</style>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script type="text/javascript">
$('.background-switch').click(function() {
//background script here
});
</script>
<div class="background-switch"></div>
<div class="wrapper">rest of website goes here</div>
I see some issues that could arise from it, but it's the best starting point to accomplish this.