Background at 100%

Jason · 04-18-2005, 07:32 AM

How can I set the background image to display at 100%? I need the entire image shown once on the screen, no more than one image, no less, as the links will be placed on it.
Thanks

DaveyBoy · 04-18-2005, 07:51 AM

can't do it as far as i know

Jazzee · 04-18-2005, 08:03 AM

Quote:

Originally Posted by Jason

How can I set the background image to display at 100%? I need the entire image shown once on the screen, no more than one image, no less, as the links will be placed on it.
Thanks

Using CSS, you can easily put your background image on the page only once, but it won't stretch or shrink with the page. It will just stay its normal size. You can also specify exactly where you want it to appear.

noob_0001 · 04-18-2005, 11:14 AM

You could make an image just a few pixels tall by a max width of 1600. Then set it to repeat in the css. You want it to repeat down which I think is "repeat-y" - not sure, but you can look it up. Only way I can think of to make it fit perfectly.

Pimpen 2010 · 04-18-2005, 02:54 PM

Quote:

Originally Posted by noob_0001

You could make an image just a few pixels tall by a max width of 1600. Then set it to repeat in the css. You want it to repeat down which I think is "repeat-y" - not sure, but you can look it up. Only way I can think of to make it fit perfectly.

I think he wants it so when you scroll, the BG doesn't move. Like if you have a picture of a sunset or something you always see that, even if you scroll down or up, the BG doesn't move at all

Jazzee · 04-18-2005, 04:06 PM

Quote:

Originally Posted by Pimpen 2010

I think he wants it so when you scroll, the BG doesn't move. Like if you have a picture of a sunset or something you always see that, even if you scroll down or up, the BG doesn't move at all

If that's what he wants, that's easy.

Code:

body
{
background-image: url('image.jpg');
background-attachment: fixed;
}

DaveyBoy · 04-18-2005, 04:19 PM

yeah i dont think that's what he wants, i think that he has made a background image with part of it being a place for some buttons to go and he wants it to appear in the same place on every browser that opens it. If that's the case, slicing would be easier.

Jason · 04-19-2005, 02:04 AM

Thankyou everyone for your help! I am redesigning Robot Wars Fansite, and want a new way to display it. Instead of the links on the left, I have made a background of a workshop, then you click the books on the shelf to read the profiles, the picture on the wall for the gallery, etc. Maybe I could put the image links in a table to keep them in the right places? Is it possible that the object links could end up off their places if viewer's browsers are set at larger displays? I am optimizing the site for 600x800. I also don't want the background to below the one with links, so could I just put a notice on the front page of the site alerting people to the fact that the site is best viewed at size 600x800?

Jason · 04-19-2005, 03:18 AM

Here is the site. http://robotwarsfansite.atspace.com/site If you wouldn't mind, I was hoping someone could give me a screen capture to show me how it looks on your browser. I would be very greatful. Thanks. It will be coloured, and nothing but a table is inserted yet.

Jazzee · 04-19-2005, 07:02 AM

It repeats on mine.

If you don't want the bg to repeat, do this:

HTML Code:

<body style="background-image: url('../site/backdrop.gif'); background-repeat: no-repeat;">

Then make the div or table that you are using to hold all your content the same size as that background image. That should keep everything where you want it.

DaveyBoy · 04-19-2005, 08:39 AM

or maybe make it an image instead of a background and add a series of image maps over the areas that are to me buttons.

paranoidandroid · 04-19-2005, 10:57 AM

Quote:

so could I just put a notice on the front page of the site alerting people to the fact that the site is best viewed at size 600x800?

I don't think that's a good idea, you run the risk of putting off visitors, the majority of whom will almost definetely have 1024x768 and upwards.

Just have the site fixed width and centre aligned, it's the best way for what you want to do, go for a width of around 750-770.

Jason · 04-19-2005, 02:32 PM

OK, Thanks everyone! JAZZEE - Where does it repeat on yours? It does on mine to the right.

Jazzee · 04-19-2005, 03:05 PM

It repeats down and to the side. It will repeat in all directions to fill up the entire screen because background images do that if you don't tell them not to.

Jason · 04-20-2005, 01:21 AM

OK, thanks!

Jason · 04-20-2005, 05:00 AM

I have added some colour to the "workshop" abnd its been going fine until now, but I don't know how to make the wood look at the angle of the flat desk, but the wood paneling on the verticles is OK. Any ideas? I have been using Microsoft Image Composer.
The URL is http://robotwarsfansite.atspace.com/site/index.htm

Jazzee · 04-20-2005, 08:26 AM

I don't understand the question.

Jason · 04-20-2005, 08:50 AM

The angle of which the woodgrain resides.

DaveyBoy · 04-20-2005, 09:28 AM

skew or distort, or perspective tools on the layer of the grain.

Ricoool · 04-20-2005, 05:38 PM

Just an idea, go into an office supply store, find the system you like and take a digital picture, the slice and use it.

That way you dont have to think about shadows, angels, lighting etc.