Sign Up! Login: Password: New User? Forgot? Support
Top Mods!
Wowhead Search
by sonofsamedi
Digital Clock
by Wolfar15
Admin Forums
Welcome to the GuildPortal Help Community! These forums are for admin-to-admin help.
Available Forums
Forums : Pimp My Site! > Non-scrolling Background
Cosmic Titan (New Admin) 9/4/2004 3:15 PM EST : Non-scrolling Background

Cosmic Titan
Posts: 5580
Zomgawsh Poster

The Exodus site has a background image that remains stationary when you scroll down.  How do we do this on a guildportal site?  Here's the Exodus sigh:

http://coh.guildportal.com/Guild.aspx?GuildID=15577&TabID=131581
TopBottom

Szleynix (New Admin) 9/4/2004 5:02 PM EST : RE: Non-scrolling Background
Szleynix
Posts: 2231
Zomgawsh Poster

The Exodus site has a background image that remains stationary when you scroll down.  How do we do this on a guildportal site?  Here's the Exodus sigh:

http://coh.guildportal.com/Guild.aspx?GuildID=15577&TabID=131581


You need to use the Custom CSS thingie in the Admin Panel

That site has

BODY
{
                MARGIN-TOP: 10PX;
 MARGIN-LEFT: 10PX;
 MARGIN-RIGHT: 10PX;
 MARGIN-BOTTOM: 10PX;
     SCROLLBAR-FACE-COLOR: #CC6600;
     SCROLLBAR-ARROW-COLOR: #FFFF33;
     SCROLLBAR-TRACK-COLOR: #660000;
     SCROLLBAR-SHADOW-COLOR: #663300;
     SCROLLBAR-HIGHLIGHT-COLOR: #CCCC00;
     SCROLLBAR-3DLIGHT-COLOR: #CCCC00;
     SCROLLBAR-DARKSHADOW-COLOR: #666633; BACKGROUND-IMAGE: URL('bg.gif');
 BACKGROUND-COLOR: #000000;
 FONT-FAMILY: Trebuchet MS, Verdana;
 FONT-SIZE: 9pt;
                BACKGROUND-IMAGE:
                URL("http://img20.imageshack.us/img20/7420/screenshot_0039.jpg");
                BACKGROUND-REPEAT:
                NO-REPEAT;
                BACKGROUND-ATTACHMENT:
                FIXED;
}

Note the last bit.  It's an image file set to 'no repeat'.  You would normally set a CSS background image to repeat, either by the x or y axis.

If you open the image link into a seperate browser, you''ll note it almost fills the screen....but that depends on your sceen resolution.

I have my screen/monitor set to 1280x1024, the image doesn't fill the screen.  Basically, it means I get a black 'border' effect to the right and bottom of the website.

Put another way, most ppl have their screen res set to something like 1024x768.  Ppl who know their pc spec will have 1280x1024 +.  Older PCs are likely to be worse off, like 800x600.

So if you set a background image, and that image has the dimensions of 1024x768.  Ppl with 800x600 will not see the fullimage, but 1 that is clipped.  Ppl with higher screens will see 'borders'.


If you want to use a single image, then i suggest you do 1 of 2 things.

1) set the image to dimensions 1024x768 (a very common screen resolution).

or,
2) use JS to set the CSS file to screen res.  Not sure this acutally works in WinXP SP2 now.  But the JS would look-up the person's screen res.  You then say (in effect)  if person has screen res A - use CSS file A.
If person has screen res B - use CSS file B.  CSS A has 1 image set to 1024x image and CSS B file uses image with 1280x image.
TopBottom

Szleynix (New Admin) 9/4/2004 5:12 PM EST : RE: Non-scrolling Background
Szleynix
Posts: 2231
Zomgawsh Poster

Doh, silly me.

Just thinking you may be thinking "eh??".  Open that image in a new window, then reset you screen res to 800x600.  now look at the image, you have to scoll the browser to see it.

If you monitor supports a higher res, then select 1280x1024 and now look at the same image.  It's now only filling part of the screen.
TopBottom

Cosmic Titan (New Admin) 9/4/2004 5:45 PM EST : RE: Non-scrolling Background

Cosmic Titan
Posts: 5580
Zomgawsh Poster

Thank you!  I think I'll just use a large image that doesn't matter if it gets cut off.  Unless, of courese, you want to give me an example of the javascript to choose beteen images and tell me where to place the script...
TopBottom

Deleted User (New Admin) 9/4/2004 6:24 PM EST : RE: Non-scrolling Background

Deleted User
Posts: 0

Oh, I would love to know how to do that JS you mentioned also!
TopBottom

Sweetapple Pye (Guild Admin) 12/3/2004 5:05 AM EST : RE: Non-scrolling Background
GP User: Adorah
Adorah
Posts: 4894
Zomgawsh Poster

To answer the actual question though:

BACKGROUND-ATTACHMENT: FIXED;

is the syntax that locks the back ground while the webpage can scroll
TopBottom

536912520_Inactive (New Admin) 12/3/2004 6:24 PM EST : RE: Non-scrolling Background

536912520_Inactive
Posts: 2765
Zomgawsh Poster

Can we just cut and paste the code, whatever it was that is provide in the previous post way at the top,  into a box somewhere on Guildportal to create this effect?

Changing the image URL of course

*Arouin
GM of Emerald Dragons
TopBottom

536912520_Inactive (New Admin) 12/3/2004 6:26 PM EST : RE: Non-scrolling Background

536912520_Inactive
Posts: 2765
Zomgawsh Poster

Can i just cut and paste that code that's in the post near the top? Where do I cut and paste it to?

Changing the image URL that's there of course

*Arouin
GM of Emerald Dragons
TopBottom

Sweetapple Pye (Guild Admin) 12/6/2004 5:17 AM EST : RE: Non-scrolling Background
GP User: Adorah
Adorah
Posts: 4894
Zomgawsh Poster

Yes you can just copy and paste the text from above.  That is the beauty of CSS.  The syntax is the same no matter the website. 

Take note that different padding and spacing will make your site change in ways that you may not want.
TopBottom

536912520_Inactive (New Admin) 12/21/2004 9:12 AM EST : RE: Non-scrolling Background

536912520_Inactive
Posts: 2765
Zomgawsh Poster

Ok, if I don't currently take advantage of CSS, then just adding that little bit won't do anything except affect the background?

Trying to be doubly sure before I do this because last time I checked out the CSS stuff, it said if you did it, you couldn't undo it.

*Arouin

Edit: NM did some fooling around on my other site.  Can copy the CSS GP creates when using the GP stuff to make the pages, and then just replace the body with your body code
TopBottom

Admins Online
There are   members online.
So-and-so has logged on!
%title%
%message%