PDA

View Full Version : how to: make background static and have body scroll?


doobiefillin
01-02-2008, 12:47 PM
i'm looking to get a layout like this:

www.glamzilla.com

if there is someone who knows how to do it i would greatly appreciate it. if not i could possibly pay someone to do it for me however i would first like to do it myself. thanks.

pedroenf
01-02-2008, 01:42 PM
Easy. Just ad the word: fixed to the "page background" and/or "body" main css options in your admincp style manager. For example: #050505 url(put here the url to the image you want - inside your image folder or even an external url) repeat fixed;. The important here is the fixed, the repeat word is for if your image it's too small to fill the monitor area.

doobiefillin
01-02-2008, 06:33 PM
that will only fix the background to the top without the repeat, but will it wont let me achieve the look like in the example i gave where the background is stationary and the body scrolls.

Freesteyelz
01-02-2008, 09:17 PM
The site is using "iframe" to achieve what you want. The side sections (that don't scroll) are one page while the inner section (that scolls) is another page. Since there's different ways to apply it search in Google for "html iframe". :)


*For next time: Please warn people if you're linking to an adult-type site. ;)

pedroenf
01-02-2008, 09:46 PM
What i said does exactly what you want and the example you named. The issue here is to have a background image that do not need the repeat condition. Play with the options. My forum does have the fixed background: www.g6-team.com

doobiefillin
01-03-2008, 01:20 AM
yeah pedro i tried your way, beautiful. thanks a lot man.

can i center the image on the website so that no matter what resolution i choose it auto centers depending on what screen resolution a person has?

pedroenf
01-03-2008, 01:25 AM
You're wellcome. ;)

Aken
01-05-2008, 05:20 AM
Yes you can center a background image easily. Here are two examples:

Center your background image at the very top of the page:

background: url(/images/header.gif) no-repeat top middle;

Center your background image 100px from the top:

background: url(/images/header.gif) no-repeat 50% 100px;

Rev O
01-06-2008, 08:42 PM
If I wanted a fixed background image (instead of the normal logo image), how would I know what size (in pixels) to make it?

Here's an example (http://losttv-forum.com/forum/forumdisplay.php?f=94) of what I'd like.

Thanks for any advise.

doobiefillin
01-07-2008, 04:42 PM
i made mine the biggest size possible for a laptop monitor (1680x1400 ish). i'm guessing if you have something centred on the screen it won't matter what size you make it since it will be centred no matter what size your display is.

Aken your code doesn't work for my website, when i tried it it makes my background blank.

Aken
01-08-2008, 07:06 AM
Aken your code doesn't work for my website, when i tried it it makes my background blank.
Did you change the URL to point to your own picture?

Rev O
01-09-2008, 12:56 PM
i made mine the biggest size possible for a laptop monitor (1680x1400 ish). i'm guessing if you have something centred on the screen it won't matter what size you make it since it will be centred no matter what size your display is.


Aken your code doesn't work for my website, when i tried it it makes my background blank.

Thanks, i'll give that a try.

Tomo123
01-14-2008, 01:25 PM
Easy. Just ad the word: fixed to the "page background" and/or "body" main css options in your admincp style manager. For example: #050505 url(put here the url to the image you want - inside your image folder or even an external url) repeat fixed;. The important here is the fixed, the repeat word is for if your image it's too small to fill the monitor area.

I just logged on and was looking for the exact same thing, Thanks for the tip m8

pedroenf
01-14-2008, 01:52 PM
You're wellcome. ;)

GlennN
01-31-2008, 07:15 AM
Awesome info and works perfectly! Many thanks!!!