Basically, what I'm wanting to do is have varying backgrounds for my site.  I want to have the code detect what resolution whoever is visiting the site, and set a specified image as the background.  If I set a small image as the background, it doesn't look good tiled or stretched.  If I set a big image as a background, you can't see the whole thing, or it looks terrible downsized.

AFAIK resolution can only be detected with javascript. PHP will certainly not work, PHP runs serverside, the resolution is clientside.

Keep in mind that there is a big difference between screen resolution and browser window resolution.

I personally wouldn't fill the background with one big image, it probably wont look good when a user resizes the window while viewing your page and keep a watch on the filesize of the image.

Meh you dont even need javascprt you can use css

CSS can't detect the user's screen resolution or browser window resolution, and that was what he asked for. Correct me if i'm wrong.

No but it can stretch to the width and height of the browser and thats all he wants from what i see.

quote:

---

Originally posted by Nathan
it can stretch to the width and height of the browser

---

quote:

---

Originally posted by Woraug
it doesn't look good tiled or stretched.

---

Hmm sorry,
My bad

I'd just but a big image as the backgroud, and if a user has their browser window smaller (or as big as it goes, but their screen resolution is low), let the image be cropped.

You should be able to see most of the image, and you can't detect the exact size of the page, just the screen rosolution, so there will be a border or cropping unless you end up being really lucky. The background is only in the background anyway.

you could just use a script that detects what res they are using and redirect them to an appropriate page. not to sure how to just change the background picture though.  To redirect them just use something like

code:

---

<script language="JavaScript">
<!--
if ((screen.width>=1024) && (screen.height>=768))
{
window.location="highres.html";
}
else
{
  window.location="lowres.html";
}
//-->
</script>

---

What would I do to that code to make it do like:

if resolution = 1024x768: redirect to background1.jpg
if resolution = 1280x1024: redirect to background2.jpg
if resolution = 1600x1200: redirect to background3.jpg

ect.

Sorry, me and coding don't get along very well

Why not create a background that works when tiled? Backgrounds work best when simple.

Or have a javascript script that detects all these things and passes them to the server so you can work with these things in php.

code:

---

browser.redirect(page.php?version=ie5&res=1024x720&colors=32&lang=en&....

---