Ok got it.. I confused exhibition formats with plugins...
------------------
[1]
Create a plugin called plugin.full_background.php
This is the code for it... Upload it in your plugin folder:
<?php if (!defined('SITE')) exit('No direct script access allowed');
/**
* Backgrounded
*
* Full Size Backgrounded
*
* @version 1.0
* @author Vaska
*/
function full_background() {
// we'll just get it from the page background image
global $rs;
if ($rs['bgimg'] != '') {
// get the dimensions
$size = getimagesize(DIRNAME . '/files/' . $rs['bgimg']);
return "<img src='" . BASEURL . "/files/$rs[bgimg]' width='$size[0]' height='$size[1]' alt=''/>";
}
return;
}
?>
------------------
[2]
Include this js in your index.html or call it in your index.html (via <script type='text/javascript' src='<%baseurl%><%basename%>/site/js/full_background.js'></script>)
.
This resizes your image according to the window size...
<script type='text/javascript'>
function bg_img_resize()
{
var w = $(window).width();
var h = $(window).height();
var iw = $('#the-background img').attr('width');
var ih = $('#the-background img').attr('height');
var rw = iw / ih;
var rh = ih / iw;
var sc = h * rw;
if (sc >= w) {
nh = h;
nw = sc;
} else {
sc = w * rh;
nh = sc;
nw = w;
}
$('#the-background img').css({height: nh, width: nw});
}
$(document).ready(function(){ bg_img_resize(); });
$(window).resize(function(){ bg_img_resize(); });
</script>
------------------
[3]
Delete this line just before the </head> tag
<plug:backgrounder color='<%color%>', img='<%bgimg%>', tile='<%tiling%>' />
And then insert this just after the <body class='section-<%section_id%>'> in your index.html.
<div id='the-background'><plug:full_background /></div>
This calls the plugin (makes the img tag into a background via js)
Exactly after the code you just inserted wrap everything else in an div called wrapper...
<div id="wrapper">
<div id='menu'>
<div class='container'>
<%obj_itop%>
<plug:front_index />
<%obj_ibot%>
<!-- you must provide a link to Indexhibit on your site someplace - thank you -->
<ul>
<li>Built with <a href='http://www.indexhibit.org/'>Indexhibit</a></li>
</ul>
</div>    
</div>    
<div id='content'>
<div class='container'>
<!-- text and image -->
<plug:front_exhibit />
<!-- end text and image -->
</div>
</div>
</div>
</body>
</html>
------------------
[4]
Include this in your style.css
#the-background {
    position: absolute;
    z-index:1;
    width: 100%;
    height:100%;
    top:0;
    left:0;
}
#wrapper {
    position: absolute;
    z-index: 2;
    width: 100%;
    height: 100%;
    top: 0;
    left:0;
}
...
Upload a background image in one of your exhibits. A small one preferably so you understand how it works. Then shrink/enlarge the window. Yoohoo! The image gets resized!