HTML help with background pic - YotaTech Forums
YotaTech Forums  

Go Back   YotaTech Forums > Toyota Forums Available > Electronics > Computer Talk

Notices

Welcome to Yotatech!
Welcome to Yotatech,

You are currently viewing our forum as a guest, which gives you limited access to view most discussions and access our other features. By joining our community, at no cost, you will have access to post topics, communicate privately with other members (PM), respond to polls, upload content and access many other special features. Registration is free, fast and simple, so please join our community today!


Reply
 
Thread Tools Search this Thread
Old 07-15-2005, 05:14 AM   #1 (permalink)
Co-Founder/Administrator
Staff
 
Corey's Avatar
 
Join Date: May 2002
Location: Auburn, Washington
Posts: 26,071
HTML help with background pic

I made a new webpage for Andy's UT 2004 server.
http://www.pnw4runners.com/gaming/unreal/ut2004.htm

On a screen running a resolution of 1024x768 the fixed background JPG looks great, as the pic is also 1024x768.

However if someone running a higher res on their desktop will see the picture with the design in it twice instead of centered.
http://www.pnw4runners.com/temp2/double_pic.jpg
Is there any code that can be inserted in the HTML to correct this so the background does not double itself?

Thanks,
This ad is not displayed to registered members.
Register your free account today and become a member on Yotatech!
Corey is offline  
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Old 07-15-2005, 06:12 AM   #2 (permalink)
Registered User
 
Churnd's Avatar
 
Join Date: Jan 2003
Location: Hattiesburg, MS
Posts: 4,093
Send a message via AIM to Churnd
I think in this line...

body background="ut_background.jpg" bgproperties="fixed"

you would need to change "fixed" to some other value. It's been a long time since I've coded manually, so I can't recall all the values off the top of my head. If you used fixed, it's going to tile it like that throughout the whole document. I would think maybe try "centered" (i doubt that's not how you actually type it), or maybe somebody else knows a better code.

Just a friendly bit of criticism... you might want to see about making the image a watermark so the text shows up on the page better.
__________________
-Chris

If you can't explain it simply, you don't understand it well enough.

Click here to search!

My Website

Last edited by Churnd; 07-15-2005 at 06:16 AM.
Churnd is offline  
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Old 07-15-2005, 06:48 AM   #3 (permalink)
lee
Contributing Member
 
lee's Avatar
 
Join Date: Dec 2003
Location: boston, ma
Posts: 6,756
Send a message via AIM to lee
what i would do is set the page's bgcolor to black (#000000). Then DEFINE A WIDTH on the centered table (esp that td with the text) and set the td with the text's background to that unreal tournament logo (using background="ut_background.jpg")

edit that unreal tournament logo to be the exact width of the table and itll look juuuust fine on any res.

if you need help, ill just code it for you... let me know.
lee is offline  
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Old 07-15-2005, 06:52 AM   #4 (permalink)
lee
Contributing Member
 
lee's Avatar
 
Join Date: Dec 2003
Location: boston, ma
Posts: 6,756
Send a message via AIM to lee
actually, i checked and that image doesnt have a real black bg (#000000)... its actually #0c0c0c
lee is offline  
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Old 07-15-2005, 07:05 AM   #5 (permalink)
lee
Contributing Member
 
lee's Avatar
 
Join Date: Dec 2003
Location: boston, ma
Posts: 6,756
Send a message via AIM to lee
here man.. i did the coding for ya (view the source):

http://www.kidmoe.com/corey_page.txt
use this as ut_background.jpg: http://www.kidmoe.com/ut_background.jpg

that will actually make the background repeat if theres too much text (which there is) so i broke it down into another table which has no bg.

to make it more readable, id just turn the opacity down on the ut_background image...

edit: heres a darkened ut_background image:

http://www.kidmoe.com/ut_background_dark.jpg

Last edited by lee; 07-15-2005 at 07:22 AM.
lee is offline  
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Old 07-15-2005, 05:04 PM   #6 (permalink)
Co-Founder/Administrator
Staff
 
Corey's Avatar
 
Join Date: May 2002
Location: Auburn, Washington
Posts: 26,071
Chris, the bgproperties="fixed command is only to keep the picture still so when you scoll to read the text.
If that command was not in there, when you scroll to read, the cool UT logo in the middle of the pic would scoll too.

Lee, yes that is not a black background, it was a screen capture when the game fires up, so the black part surrounding the logo is acutaly part of the pic.

I know nothing about tables, never tried before.
I will try copying and pasting your text into a new FP session and see what happens.

I will post back here later when I get a chance.
Lee, thanks a lot for coding that and the pic.
I like the lighter pic better.

PS, here is test one, not complete.
http://www.pnw4runners.com/gaming/un...t2004_test.htm

The background is no longer fixed, as the logo scrolls with the text now.
I will have to look at the source later.
Corey is offline  
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Old 07-16-2005, 01:29 PM   #7 (permalink)
Co-Founder/Administrator
Staff
 
Corey's Avatar
 
Join Date: May 2002
Location: Auburn, Washington
Posts: 26,071
Lee, I looked at the source code again for the page you made, but the graphic is moving along with the text, it is not behaving to the bgpropeties="fixed" command for some reason.
Corey is offline  
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Old 07-16-2005, 06:29 PM   #8 (permalink)
Guest
 
4RUNR's Avatar
 
Join Date: Jun 2003
Location: North Pole
Posts: 1,619
Fixed background images are a bad idea from a usability standpoint as most browsers seem to have difficulty rendering pages with them resulting in jerky scrolling.

But if you are set on them, how far are you willing to go to get it to look right on all resolutions? You can always get the users’ screen resolution, and depending on that serve up different background images using some SSI code.
4RUNR is offline  
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Old 07-16-2005, 11:56 PM   #9 (permalink)
lee
Contributing Member
 
lee's Avatar
 
Join Date: Dec 2003
Location: boston, ma
Posts: 6,756
Send a message via AIM to lee
Quote:
Originally Posted by Corey
Lee, I looked at the source code again for the page you made, but the graphic is moving along with the text, it is not behaving to the bgpropeties="fixed" command for some reason.
yup, i took that out. as was just said by 4runr, fixed bg's are bad for visitors... theyre confusing, awkward and hard to read around.

stick to my code, only because it will give you what youre looking for but make it user friendly.

also, tables are quite easy.

you open a < table > (no spaces) and define a width (in pixels) within it (lets say 800).

then you add a table row < tr >. no need to define anything.

then you add a table column < td > and define a width. you should also put in valign="top" so that all the content in the table column will be at the top, rather than centering itself versus any other TD (table columns) you make.

you can make as many tds as you want as long as the total width is equal to the table width (of course).

then you close it all out... < /td > < /tr > < /table >

so in this case the code would be (without spaces!!)

< table width=800 >
< tr >
< td width=400 >
Hi, my name is corey!
< /td >
< td width=400 >
this is column #2
< /td >
< /tr >
< /table >

take the spaces out and place that in your editor....

hope that helped ya.
thats about it...

Last edited by lee; 07-16-2005 at 11:58 PM.
lee is offline  
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Old 07-17-2005, 12:00 AM   #10 (permalink)
lee
Contributing Member
 
lee's Avatar
 
Join Date: Dec 2003
Location: boston, ma
Posts: 6,756
Send a message via AIM to lee
Quote:
Originally Posted by Corey
Lee, I looked at the source code again for the page you made, but the graphic is moving along with the text, it is not behaving to the bgpropeties="fixed" command for some reason.
i just understood what you meant. its the background image of the cell containing the text... so it wont move... it will just sit behind the text.
lee is offline  
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Old 07-18-2005, 10:11 AM   #11 (permalink)
Registered User
 
BlueTrane's Avatar
 
Join Date: Jul 2002
Location: Lewisville, TX
Posts: 102
Send a message via AIM to BlueTrane Send a message via MSN to BlueTrane Send a message via Yahoo to BlueTrane
It appears as though you've fixed your problem. However, I recommend checking out CSS (cascading style sheets). Their purpose is to separate format from content. Using CSS with HTML allows MUCH greater control over display, and I find it easier to control on the fly. A good place to start is to check out http://www.w3schools.com/css/default.asp. They provide a good introduction and lots of examples.

In your page, I'd break it into 3 sections: Header, Content, and Footer. So in your HTML code you'd have 3 ID sections. In the Content DIV, you'd specify a background image with no repeat. I don't want to overload you with information you probably won't use or understand, but I'd be happy to help you out if you want to make the jump to using CSS.

Good luck.
__________________
2006 IS350
1996 SC400
2002 4Runner Sport -- SOLD
BlueTrane is offline  
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Old 07-18-2005, 11:48 AM   #12 (permalink)
Registered User
 
BlueTrane's Avatar
 
Join Date: Jul 2002
Location: Lewisville, TX
Posts: 102
Send a message via AIM to BlueTrane Send a message via MSN to BlueTrane Send a message via Yahoo to BlueTrane
Corey,
Just for fun, I redid your code using CSS as an example. I've attached it.
Regards,
Nick
Attached Files
File Type: zip index.zip (2.4 KB, 17 views)
__________________
2006 IS350
1996 SC400
2002 4Runner Sport -- SOLD
BlueTrane is offline  
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Old 07-18-2005, 08:36 PM   #13 (permalink)
lee
Contributing Member
 
lee's Avatar
 
Join Date: Dec 2003
Location: boston, ma
Posts: 6,756
Send a message via AIM to lee
yea, mine is a solution, but if you want to get serious about making designs that truely function, you should take some time to learn html and css.
lee is offline  
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Reply

Thread Tools Search this Thread
Search this Thread:

Advanced Search

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are Off
Pingbacks are Off
Refbacks are Off

Similar Threads
Thread Thread Starter Forum Replies Last Post
Background Pics! 95RunnerSR5 86-95 Trucks & 4Runners 104 03-31-2007 02:21 PM
background check Toys-R-Us Off Topic Talk 3 06-20-2006 02:38 PM
Suggestions for Background Check Haston Off Topic Talk 2 08-18-2005 01:12 PM
Check out this new background I just made. Paul 95.5-2004 Tacomas & 96-2002 4Runners 7 01-19-2005 09:56 PM


All times are GMT -8. The time now is 10:06 AM.


Powered by vBulletin® Version 3.7.4
Copyright ©2000 - 2009, Jelsoft Enterprises Ltd.
Search Engine Optimization by vBSEO 3.1.0
Powered by vbWiki Pro . Copyright ©2006, NuHit, LLC
2009 InternetBrands, Inc.