Hey,

I am trying to make my web page load a different image depending on the screen resolution that you are viewing the page with.

I currently have a seperate page that has java code to redirect to a different web page depending on the resolution of the computer viewing the page. I have decided it would be more practicle if there was no redirecting page and there was just one page that had different images load depending on the screen resolution.

My code i was using for the page redirect is below.

Can this code be implemented on a web page so a different image loads depending on the screen resolution?

I dont know the java commands to load an image onto the screen or if it is even as easy as i think it is.

Also how can i make it so the images load in a certain place on the screen?

The website i am trying to make this work on is below. Check it out to see how my current code works. I would like to cange it so the main image is larger on higher resolution computers and smaller on low resolution ones.

http://members.shaw.ca/t-steele
or
http://www.cordovabayvacationsvictoria.com

the index file redirects you to either main2.html or main3.html.

I want to get rid of the main pages and just have an index that takes care of screen resolution issues.

Any help would be much appreciated.

Thanks for the help. Coding is below.


<script language="JavaScript">

if (window.screen){
var w = screen.width;
tmt_url_800 = "main2.html";
tmt_url_1024 = "main3.html";

if(w<740){
self.location.replace(tmt_url_800);
}

if(w>=740 & w<835){
self.location.replace(tmt_url_800);
}

if(w>=835){
self.location.replace(tmt_url_1024);
}

}//tmtC_resolutionRedirectEnd
</script>