TalkPHP
 
 
Account Login
Latest Articles
» The basic usage of PHPTAL, a XML/XHTML template library for PHP
» Vulnerable methods and the areas they are commonly trusted in.
» Simple way to protect a form from bot
» The Basics On: How Session Stealing Works
» How to keep your forms from double posting data
IRC Channel
IRC Speech Bubble Join the friendly bunch on IRC...
(#TalkPHP on Freenode)

...Also available via a web interface.

See this thread for information on the TalkPHP Free Hugs Initiative™. Subject to availability.
Associates
Associates
CSS Tutorials
Reply
 
LinkBack Thread Tools Search this Thread Display Modes
Old 03-01-2010, 01:06 PM   #1 (permalink)
The Wanderer
 
Join Date: Feb 2010
Posts: 6
Thanks: 1
aquastream is on a distinguished road
Default Cropping Background Image for Most Resolutions

A newbie question - I setup a 1920x1080 image figuring that those dimensions would handle most PC monitors. In the very centre of this image is an important 1020x768 area which I want to show everytime somebody views the site - obviously it wouldn't display properly if they're a 800x600 user, but I'm figuring most people have gone past that by now. The rest of the background image though is extraneous, and I really don't care if bits of it are cut off depending on the person's screen resolution.

So the question is, how do I ensure that the image is shown from the centre rather than from the top left hand corner? Would I need some code to sense the screen resolution of their monitor and then have different versions for each, or is there a single HTML or whatever language command that will allow me to do this with a single image?
aquastream is offline  
Reply With Quote
Old 03-01-2010, 01:51 PM   #2 (permalink)
The Acquainted
 
Hightower's Avatar
 
Join Date: May 2009
Location: Durham, UK
Posts: 134
Thanks: 9
Hightower is on a distinguished road
Default

Putting fixed center no-repeat in the background CSS tag?
__________________
Hightower's Softpolio
Send a message via MSN to Hightower
Hightower is offline  
Reply With Quote
Old 03-01-2010, 03:04 PM   #3 (permalink)
is cute and cuddly
 
delayedinsanity's Avatar
 
Join Date: Mar 2008
Location: Vegas, Baby
Posts: 963
Thanks: 31
delayedinsanity is on a distinguished road
Default

css Code:
#element { background: url('pshaw.jpg') no-repeat top center; }
delayedinsanity is offline  
Reply With Quote
Old 03-08-2010, 07:16 PM   #4 (permalink)
The Contributor
 
Join Date: Apr 2005
Location: Kent, UK
Posts: 54
Thanks: 0
Dr John is on a distinguished road
Default

It would be much more sensible and user friendly if you used an image of the size you actually need and then just had either a white background or some colour the matched the rest of the image. Users don't like having to download huge images. Also why is part of this image so important that it has to be seen??? Web sites are not designed by making a big image that contains information, you use html and text to convey information to the use. And google will just see image and not read anything on it that you consider important. (google doesn't use OCR for example.)

Just because someone has a high res wide screen monitor doesn't mean that they will be displaying their browser at full screen - the main reason for a big wide monitor is to have multiple windows visible at the same time. So even those with a big monitor will not actually see your big image to its full extent. So why punish the poor people with smaller monitors by forcing a long slow download of your big image?
__________________
www.kidneydialysis.org.uk
Dr John is offline  
Reply With Quote
Reply



Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes

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

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

Similar Threads
Thread Thread Starter Forum Replies Last Post
Cropping Images using PHP Rendair Advanced PHP Programming 22 05-17-2012 10:22 AM
Image Reflections in PHP Rendair Advanced PHP Programming 17 11-30-2011 08:41 AM
Dynamicly place text on a background image ReSpawN Advanced PHP Programming 2 04-26-2008 09:37 PM
The Big GD Guide - Part 2 Rendair Advanced PHP Programming 3 03-07-2008 12:14 AM
Simple GD Code For Text With A Background Image. Alex.Prisoner Advanced PHP Programming 1 01-05-2008 11:27 PM


All times are GMT. The time now is 12:07 AM.

 
     

Powered by vBulletin® Version 3.6.8
Copyright ©2000 - 2013, Jelsoft Enterprises Ltd.
Search Engine Optimization by vBSEO 3.1.0
Inactive Reminders By Icora Web Design