Screen resolution

**Gordon Burditt** · Oct 16 '06, 10:55 PM

Re: Screen resolution

>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.

Use code to translate the IP address of the workstation into the screen
resolution. Granted, this may require some manual collecting of data first.

**Jeff North** · Oct 17 '06, 12:15 AM

Re: Screen resolution

On Mon, 16 Oct 2006 23:50:50 +0100, in comp.lang.php Steve Wright
<usenet@wrightn et.demon.co.uk>
<4RLhsRJKzANFFw gU@wrightnet.de mon.co.ukwrote:

>| 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.cs s"
title="medium" />
<link rel="alternate stylesheet" type="text/css" href="large.css "
title="large" />

<script type="text/javascript">
function setActiveStyleS heet(title)
{
var i, a, main;
for(i=0; (a = document.getEle mentsByTagName( "link")[i]); i++) {
if(a.getAttribu te("rel").index Of("style") != -1 &&
a.getAttribute( "title")) {
a.disabled = true;
if(a.getAttribu te("title") == title) a.disabled = false;
}
}
}
</head>
<body>
<p><strong>Scre en Size</strong><br />
<select name="lbCSS" id="lbCSS"
onchange="setAc tiveStyleSheet( this.value);">
<option value="small">S mall</option>
<option value="medium"> Medium</option>
<option value="large">L arge</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.
---------------------------------------------------------------
jnorthau@yourpa ntsyahoo.com.au : Remove your pants to reply
---------------------------------------------------------------

**Chung Leong** · Oct 17 '06, 05:25 AM

Re: Screen resolution

Steve Wright 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?

Nope. The use of document.write (circa 1990s) will work just as well
though.

<script>

var css = 'norm.css';

if(screen.avail Height 1024) {
css = 'big.css';
}
/* ... etc. ... */

document.write( '<link rel="stylesheet " type="text/css" href="' + css +
'">');

</script>

**Steve Wright** · Oct 17 '06, 07:45 AM

Re: Screen resolution

In message <12j84ftipg84v9 2@corp.supernew s.com>, Gordon Burditt
<gordonb.aa1wj@ burditt.orgwrit es

>>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.

>
>Use code to translate the IP address of the workstation into the screen
>resolution. Granted, this may require some manual collecting of data first.
>
>

Interesting idea, but we have dynamic IP addresses.
--
Steve Wright

**Steve Wright** · Oct 17 '06, 07:45 AM

Re: Screen resolution

In message <cg88j2t15godhd bdi6s4c62u0d42b 6pqav@4ax.com>, Jeff North
<jnorthau@yahoo .com.auwrites

>On Mon, 16 Oct 2006 23:50:50 +0100, in comp.lang.php Steve Wright
><usenet@wright net.demon.co.uk >
><4RLhsRJKzANFF wgU@wrightnet.d emon.co.ukwrote :
>

>>| 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.cs s"
>title="mediu m" />
><link rel="alternate stylesheet" type="text/css" href="large.css "
>title="large " />
>
><script type="text/javascript">
>function setActiveStyleS heet(title)
>{
var i, a, main;
for(i=0; (a = document.getEle mentsByTagName( "link")[i]); i++) {
if(a.getAttribu te("rel").index Of("style") != -1 &&
>a.getAttribute ("title")) {
a.disabled = true;
if(a.getAttribu te("title") == title) a.disabled = false;
}
}
>}
></head>
><body>
><p><strong>Scr een Size</strong><br />
><select name="lbCSS" id="lbCSS"
>onchange="setA ctiveStyleSheet (this.value);">
<option value="small">S mall</option>
<option value="medium"> Medium</option>
<option value="large">L arge</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.
>
>ALternativel y, 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.
>---------------------------------------------------------------
>jnorthau@yourp antsyahoo.com.a u : Remove your pants to reply
>---------------------------------------------------------------

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.
--
Steve Wright

**Jeff North** · Oct 17 '06, 11:35 AM

Re: Screen resolution

On Tue, 17 Oct 2006 08:51:08 +0100, in comp.lang.php Steve Wright
<usenet@wrightn et.demon.co.uk>
<Kbo62POstINFFw nJ@wrightnet.de mon.co.ukwrote:

>| In message <cg88j2t15godhd bdi6s4c62u0d42b 6pqav@4ax.com>, Jeff North
>| <jnorthau@yahoo .com.auwrites
>| >On Mon, 16 Oct 2006 23:50:50 +0100, in comp.lang.php Steve Wright
>| ><usenet@wright net.demon.co.uk >
>| ><4RLhsRJKzANFF wgU@wrightnet.d emon.co.ukwrote :
>| >
>| >>| 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.cs s"
>| >title="mediu m" />
>| ><link rel="alternate stylesheet" type="text/css" href="large.css "
>| >title="large " />
>| >
>| ><script type="text/javascript">
>| >function setActiveStyleS heet(title)
>| >{
>| var i, a, main;
>| for(i=0; (a = document.getEle mentsByTagName( "link")[i]); i++) {
>| if(a.getAttribu te("rel").index Of("style") != -1 &&
>| >a.getAttribute ("title")) {
>| a.disabled = true;
>| if(a.getAttribu te("title") == title) a.disabled = false;
>| }
>| }
>| >}
>| ></head>
>| ><body>
>| ><p><strong>Scr een Size</strong><br />
>| ><select name="lbCSS" id="lbCSS"
>| >onchange="setA ctiveStyleSheet (this.value);">
>| <option value="small">S mall</option>
>| <option value="medium"> Medium</option>
>| <option value="large">L arge</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.
>| >
>| >ALternativel y, 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@yourpa ntsyahoo.com.au : Remove your pants to reply
---------------------------------------------------------------

**maven22** · Oct 17 '06, 05:45 PM

Re: Screen resolution

Why not JavaScript AND PHP:

at the very top of the page, put:
<?php
if( !isset($_GET['x']) || !isset($_GET['y']) ) {
echo '<script type="text/javascript">';
echo 'window.locatio n="THIS_PAGE.ph p?x=" + screen.availWid th + "&y="
+ screen.availHei ght';
echo '</script>';
die();
}

// now write the rest of your page, with $_GET['x'] and $_GET['y'] as
the resolution.

?>

this code will refresh the page instantly with the screen width &
height.

Jeff North wrote:

On Tue, 17 Oct 2006 08:51:08 +0100, in comp.lang.php Steve Wright
<usenet@wrightn et.demon.co.uk>
<Kbo62POstINFFw nJ@wrightnet.de mon.co.ukwrote:
>

| In message <cg88j2t15godhd bdi6s4c62u0d42b 6pqav@4ax.com>, Jeff North
| <jnorthau@yahoo .com.auwrites
| >On Mon, 16 Oct 2006 23:50:50 +0100, in comp.lang.php Steve Wright
| ><usenet@wright net.demon.co.uk >
| ><4RLhsRJKzANFF wgU@wrightnet.d emon.co.ukwrote :
| >
| >>| 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.cs s"
| >title="mediu m" />
| ><link rel="alternate stylesheet" type="text/css" href="large.css "
| >title="large " />
| >
| ><script type="text/javascript">
| >function setActiveStyleS heet(title)
| >{
| var i, a, main;
| for(i=0; (a = document.getEle mentsByTagName( "link")[i]); i++) {
| if(a.getAttribu te("rel").index Of("style") != -1 &&
| >a.getAttribute ("title")) {
| a.disabled = true;
| if(a.getAttribu te("title") == title) a.disabled = false;
| }
| }
| >}
| ></head>
| ><body>
| ><p><strong>Scr een Size</strong><br />
| ><select name="lbCSS" id="lbCSS"
| >onchange="setA ctiveStyleSheet (this.value);">
| <option value="small">S mall</option>
| <option value="medium"> Medium</option>
| <option value="large">L arge</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.
| >
| >ALternativel y, 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@yourpa ntsyahoo.com.au : Remove your pants to reply
---------------------------------------------------------------

**Jeff North** · Oct 18 '06, 02:05 AM

Re: Screen resolution

On 17 Oct 2006 11:03:20 -0700, in comp.lang.php "maven22"
<mattvenables@g mail.com>
<1161108200.259 078.82270@f16g2 000cwb.googlegr oups.comwrote:

>| Jeff North wrote:
>| On Tue, 17 Oct 2006 08:51:08 +0100, in comp.lang.php Steve Wright
>| <usenet@wrightn et.demon.co.uk>
>| <Kbo62POstINFFw nJ@wrightnet.de mon.co.ukwrote:
>| >
>| | In message <cg88j2t15godhd bdi6s4c62u0d42b 6pqav@4ax.com>, Jeff North
>| | <jnorthau@yahoo .com.auwrites
>| | >On Mon, 16 Oct 2006 23:50:50 +0100, in comp.lang.php Steve Wright
>| | ><usenet@wright net.demon.co.uk >
>| | ><4RLhsRJKzANFF wgU@wrightnet.d emon.co.ukwrote :
>| | >
>| | >>| 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.cs s"
>| | >title="mediu m" />
>| | ><link rel="alternate stylesheet" type="text/css" href="large.css "
>| | >title="large " />
>| | >
>| | ><script type="text/javascript">
>| | >function setActiveStyleS heet(title)
>| | >{
>| | var i, a, main;
>| | for(i=0; (a = document.getEle mentsByTagName( "link")[i]); i++) {
>| | if(a.getAttribu te("rel").index Of("style") != -1 &&
>| | >a.getAttribute ("title")) {
>| | a.disabled = true;
>| | if(a.getAttribu te("title") == title) a.disabled = false;
>| | }
>| | }
>| | >}
>| | ></head>
>| | ><body>
>| | ><p><strong>Scr een Size</strong><br />
>| | ><select name="lbCSS" id="lbCSS"
>| | >onchange="setA ctiveStyleSheet (this.value);">
>| | <option value="small">S mall</option>
>| | <option value="medium"> Medium</option>
>| | <option value="large">L arge</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.
>| | >
>| | >ALternativel y, 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%" />
>|
>| Why not JavaScript AND PHP:
>|
>| at the very top of the page, put:
>| <?php
>| if( !isset($_GET['x']) || !isset($_GET['y']) ) {
>| echo '<script type="text/javascript">';
>| echo 'window.locatio n="THIS_PAGE.ph p?x=" + screen.availWid th + "&y="
>| + screen.availHei ght';
>| echo '</script>';
>| die();
>| }
>|
>| // now write the rest of your page, with $_GET['x'] and $_GET['y'] as
>| the resolution.
>|
>| ?>
>|
>| this code will refresh the page instantly with the screen width &
>| height.

Well there's no right way or wrong way, IMNSHO.

The problem I see with your code is that you are assuming that the
person has their browser open full screen, this may or maynot be the
case.

Not all browsers implement clientWidth/Height so your code would need
some additional 'sniffing' to work out the values (not to mention that
the data is passed in the url and therefore you'd need to error
detection on these value i.e. index.php?x=app les&y=oranges).
---------------------------------------------------------------
jnorthau@yourpa ntsyahoo.com.au : Remove your pants to reply
---------------------------------------------------------------

**maven22** · Oct 18 '06, 09:05 PM

Re: Screen resolution

Of course I didn't include error detection because it's just for
concept - I'm not writing his code for him. And, he stated this at the
beginning "This is for intranet
application where I know the browser will be IE6 with javascript
enabled
running in full screen mode and toolbars hidden"

Jeff North wrote:

On 17 Oct 2006 11:03:20 -0700, in comp.lang.php "maven22"
<mattvenables@g mail.com>
<1161108200.259 078.82270@f16g2 000cwb.googlegr oups.comwrote:
>

| Jeff North wrote:
| On Tue, 17 Oct 2006 08:51:08 +0100, in comp.lang.php Steve Wright
| <usenet@wrightn et.demon.co.uk>
| <Kbo62POstINFFw nJ@wrightnet.de mon.co.ukwrote:
| >
| | In message <cg88j2t15godhd bdi6s4c62u0d42b 6pqav@4ax.com>, Jeff North
| | <jnorthau@yahoo .com.auwrites
| | >On Mon, 16 Oct 2006 23:50:50 +0100, in comp.lang.php Steve Wright
| | ><usenet@wright net.demon.co.uk >
| | ><4RLhsRJKzANFF wgU@wrightnet.d emon.co.ukwrote :
| | >
| | >>| 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.cs s"
| | >title="mediu m" />
| | ><link rel="alternate stylesheet" type="text/css" href="large.css "
| | >title="large " />
| | >
| | ><script type="text/javascript">
| | >function setActiveStyleS heet(title)
| | >{
| | var i, a, main;
| | for(i=0; (a = document.getEle mentsByTagName( "link")[i]); i++) {
| | if(a.getAttribu te("rel").index Of("style") != -1 &&
| | >a.getAttribute ("title")) {
| | a.disabled = true;
| | if(a.getAttribu te("title") == title) a.disabled = false;
| | }
| | }
| | >}
| | ></head>
| | ><body>
| | ><p><strong>Scr een Size</strong><br />
| | ><select name="lbCSS" id="lbCSS"
| | >onchange="setA ctiveStyleSheet (this.value);">
| | <option value="small">S mall</option>
| | <option value="medium"> Medium</option>
| | <option value="large">L arge</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.
| | >
| | >ALternativel y, 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%" />
|
| Why not JavaScript AND PHP:
|
| at the very top of the page, put:
| <?php
| if( !isset($_GET['x']) || !isset($_GET['y']) ) {
| echo '<script type="text/javascript">';
| echo 'window.locatio n="THIS_PAGE.ph p?x=" + screen.availWid th + "&y="
| + screen.availHei ght';
| echo '</script>';
| die();
| }
|
| // now write the rest of your page, with $_GET['x'] and $_GET['y'] as
| the resolution.
|
| ?>
|
| this code will refresh the page instantly with the screen width &
| height.

>
Well there's no right way or wrong way, IMNSHO.
>
The problem I see with your code is that you are assuming that the
person has their browser open full screen, this may or maynot be the
case.
>
Not all browsers implement clientWidth/Height so your code would need
some additional 'sniffing' to work out the values (not to mention that
the data is passed in the url and therefore you'd need to error
detection on these value i.e. index.php?x=app les&y=oranges).
---------------------------------------------------------------
jnorthau@yourpa ntsyahoo.com.au : Remove your pants to reply
---------------------------------------------------------------

Screen resolution

Screen resolution

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment