|
|
Posted by Jeff North on 10/17/06 12:02
On Tue, 17 Oct 2006 08:51:08 +0100, in comp.lang.php Steve Wright
<usenet@wrightnet.demon.co.uk>
<Kbo62POstINFFwnJ@wrightnet.demon.co.uk> wrote:
>| In message <cg88j2t15godhdbdi6s4c62u0d42b6pqav@4ax.com>, Jeff North
>| <jnorthau@yahoo.com.au> writes
>| >On Mon, 16 Oct 2006 23:50:50 +0100, in comp.lang.php Steve Wright
>| ><usenet@wrightnet.demon.co.uk>
>| ><4RLhsRJKzANFFwgU@wrightnet.demon.co.uk> wrote:
>| >
>| >>| Hi
>| >>|
>| >>| I'm developing a webpage that needs to include a different stylesheet
>| >>| depending on the screen resolution.
>| >>|
>| >>| I know that I could read the resolution in javascript and then do some
>| >>| sort of stylesheet switcher as part of the onload event but I would
>| >>| rather link in the correct stylesheet for the resolution in the first
>| >>| place.
>| >>|
>| >>| Is there anyway of reading the screen resolution using PHP?
>| >
>| >Not really.
>| >
>| >>| Please don't flame me about "screen resolution being useless as not
>| >>| everyone browses in a maximised window". This is for intranet
>| >>| application where I know the browser will be IE6 with javascript enabled
>| >>| running in full screen mode and toolbars hidden. I also know the three
>| >>| possible screen resolutions that it could be.
>| >
>| >Let the browser do the work (like it should) and let the user select
>| >what option that they want.
>| >-------------------------------------------------------------------
>| ><head>
>| ><link rel="stylesheet" type="text/css" href="small.css" title="small"
>| >/>
>| ><link rel="alternate stylesheet" type="text/css" href="medium.css"
>| >title="medium" />
>| ><link rel="alternate stylesheet" type="text/css" href="large.css"
>| >title="large" />
>| >
>| ><script type="text/javascript">
>| >function setActiveStyleSheet(title)
>| >{
>| > var i, a, main;
>| > for(i=0; (a = document.getElementsByTagName("link")[i]); i++) {
>| > if(a.getAttribute("rel").indexOf("style") != -1 &&
>| >a.getAttribute("title")) {
>| > a.disabled = true;
>| > if(a.getAttribute("title") == title) a.disabled = false;
>| > }
>| > }
>| >}
>| ></head>
>| ><body>
>| ><p><strong>Screen Size</strong><br />
>| ><select name="lbCSS" id="lbCSS"
>| >onchange="setActiveStyleSheet(this.value);">
>| > <option value="small">Small</option>
>| > <option value="medium">Medium</option>
>| > <option value="large">Large</option>
>| ></select>
>| ></body>
>| >----------------------------------------------------------------------
>| >If you want the appropriate css to be loaded each time then store the
>| >value in a cookie and read/update this value.
>| >
>| >ALternatively, you could use CSS floating layout. This will allow the
>| >browser to automatically resize it's contents. You only need 1 CSS
>| >file to manage the myriad of screen resolutions that are available.
>|
>| That's the fall back option I thought of. However its not just the text
>| I'm scaling, its the graphics as well. I'm using PHP and the GD
>| extension to generate the six images. These images consume most of the
>| space on the screen hence the need to scale them correctly.
Use percentages on the width/height.
<img src="xyz.gif" width="100%" height="75%" />
---------------------------------------------------------------
jnorthau@yourpantsyahoo.com.au : Remove your pants to reply
---------------------------------------------------------------
[Back to original message]
|