[syllogism]

Many Thanks to Zaja for supplying this code that worked for me in the Home.tpl of the Flexy Rectangles template re the picture main_bg_1.jpg. The idea was to display a diferent version (size) of the same picture depending upon the resolution of the viewing monitor.

2. header code:
Code:
<script type="text/javascript">
//<![CDATA[
{literal}

var w=screen.width;
var h=screen.height;

function resolution() {
if((w==800)&&(h==600)) {
document.getElementById('point').background='skin1 /images/custom/800_600_bg.jpg';
}
else if((w==1024)&&(h==76) {
document.getElementById('point').background='skin1 /images/custom/1024_768_bg.jpg';
}
else if((w==1152)&&(h==864)) {
document.getElementById('point').background='skin1 /images/custom/1152_864_bg.jpg';
}
else if((w==1280)&&(h==960)) {
document.getElementById('point').background='skin1 /images/custom/1280_960_bg.jpg';
}
else if((w==1280)&&(h==1024)) {
document.getElementById('point').background='skin1 /images/custom/1280_1024_bg.jpg';
}
}
onload=resolution;

{/literal}
//]]>
</script>

3. Table code:
Code:
<table id="point" width="100%" border="0" cellpadding="0" cellspacing="0" background="skin1/images/default_bg.jpg" class="MainImageBackground">