Best way to make an Image a background?

[rabbidrabbit]

OK,

Whats the best way to take an image such as a photo and make it fit as a background on a web page?  Basically, I would like it to scale properly and cover the whole background area while minimizing size..  Ideas?  Have Dreamweaver and adobe suites..

[Lizking]

Without using some java, you can't, because of the different resolutions people use.

edit=I forgot, you can do it, but you have to take control of the screen, like this:

onClick="MyWindow=window.open('yourpage.htm','MyWindow','toolbar=no,location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, width=780, height=470'); return false;">Your Page

[JB73]

if i am reading your request right, you want a picture to resize when a user manually resizes the window correct?

i have never seen that done before, and i can not imagine a way to do it.

[CyranoAH]

I think what he means is that he wants the pic to cover the whole window no matter what resolution the user has set in his computer.

That can be done via detection of the screen resolution. With javascript, you can tell the page to show a different pic (one at 800x600, one at 1024x768, etc) depending on the detected resolution.

If that's what you want, let me know.

Daniel

[StSanta]

Still got a problem when the user resizes the window, but it's an alternative. Another problem is the rather big number of different resolutions the visitors might be using. Looks fine in say 800*600 or 1024*768, but anything more than that and it's f*cked up.

Overall, I do not recommend using a largeish pic as a background. There's so much fluff on websites nowadays. Many aren't scaling very well, and it doesn't matter if you have a 10Mbit line if the webserver can't deliver.

 If possible, the image should either be broken up into bits (such as top, left, right, bottom like if you want a frame around something), or be created so that it can blend in with either a background colour, or another (repeating) background image.

If you *really* want to make sure the site looks the same for everyone, ya gotta set a fixed size. And use DOM standards. No, wait, IE doesn't care much about that. Use both IE and DOM standards. No, wait, IE on Mac doesn't meet IE PC standards.

Let's see....



Firefox good. Rest bad. Apache good. IIS bad.

[Saintaw]

Replying to the initial question:

If you want the resolution to fit, you'll have to have a different set of images and then detect the resolution, let me know if you need that.

Now, what Santa said makes sense, but start here for your homepage

Here's the idea:

etc...

(Sorry guys, long day, am a bit lazy hehe)

Edit: Re-read your question.
Well, if what JB sais is what you want, you're in for a treat... and a lot of code for very little effect.

Simpler way would be to set your page in Flash, that will auto-resize it when the user changes the window size.

[Saintaw]

PS if you're not familliar with flash, try Swish:

http://www.swishzone.com/

[StSanta]

Flash is Eeeehvl Saw, you should know that!

It's like a powerful drug - people just *cannot* resist the temptation of misusing it.

Hey dude, you're still freelancing, right? Know any ColdFusion? If so, I might be able to sling some work your way (we're overloaded with the stuff right now; working 12-13 hour days, and I'm *still* lagging behind.

[Saintaw]

Santa, you're going to like this

Been freelancing for the Commission this last year (ColdFusion, Java & Oracle)

My next job is probably in Stockholm (sent application this morning... crossing fingers) If I don't get that one, I'll very probably be interested (saw at onpoi dot net)
Am also "back" with the Ex wife, she's in Orlando though... and getting a working permit in the US is a beotch... so, I'm open to options.

PS:I'm with you about Flash, I'm no stinkin' graphist... but if Dad want's to do a squad hompage, it won't hurt

PPS: Missunderstood your post I think, If you need help with CFML , email me (They're drivin me nuts with the current project.... but I'll see what I can do )

[Saintaw]

PPPS: I *might* have to come down to Stockholm in two weeks... is that far from Denmark? (You can see that this BBS's culture has a taint on me... I forgot my geography courses )

PPPPPPPPPPS: Is there a class/therapy for using too many PS's and too many smileys ?

[rabbidrabbit]

It sounds like the only way to make it actually work would be to detect the resolution and have essentially a number of images each getting served depending on the screen res of the client.  Ok, so it sounds like I'm better off fading the image into a background color and letting it handle itself?  Basically, its a image of a couple of kids in a boat that was to go on the front page of our lake association so I don't really want to go nuts on something thats a freebee.  I was hoping there was some obsure way the image could auto scale But if I'm getting this right there isn't.

[Lizking]

Well, if you don't use it as a background, but embed it in the page, it will probably work better anyway.

[rabbidrabbit]

Ya, thats what I was thinking..  Make the background color the same color as the image and fade the edges with the background color.  Now I just have to figure out what size to use ....

[Lizking]

I still always use 640 by 480 as my minimum, you would be surprised by how many people still use that rez.  That makes the largest usable picture size about 320x240.  Keeping in mind that most of my stuff is for friends and relatives, and for small scale businesses.

Here is a picture that I faded into the background so that it was usable for 640x480 to 1200x1600:

http://www.lizking.com/mainvarkoi.htm

[Saintaw]

Nice fish!