Welcome Guest ( Log In | Register )

Outline · [ Standard ] · Linear+

 PHP detect browser window size, $_Get['width'] ??

views
     
TSCodeBasic
post Apr 30 2009, 11:22 AM, updated 17y ago

Getting Started
**
Junior Member
60 posts

Joined: Apr 2009
hi..i wan to ask how to use PHP to check the browser window size ? if let say, my code:

<?
$myWidth = '<script> document.write(window.innerWidth); </script>';

echo $myWidth;

if ($myWidth < 1008) { //when i resize the browser window to 1024x768px, the echo $myWidth is 1008

$setWidth = 550;

echo '<div id="Panorama" style="width:'.$setWidth.'px; height:130px;overflow:hidden; background-color: transparent; margin-top:5; padding: 20px; margin-left: 0px;">';

} else { //when i resize the browser window to 1280x800px, the echo $myWidth is 1264

$setWidth = 750;

echo '<div id="Panorama" style="width:'.$setWidth.'px; height:130px;overflow:hidden; background-color: transparent; margin-top:5; padding: 20px; margin-left: 0px;">';

}?>

My problem is : No matter how i resize the browser window size, it always go to if ($myWidth < 1008){}...i cant get the $setWidth correctly, anything wrong in my code?

This post has been edited by CodeBasic: Apr 30 2009, 11:24 AM
SUSlovely_named
post Apr 30 2009, 11:54 AM

Getting Started
**
Junior Member
102 posts

Joined: Sep 2008
php has his hands clean right after the document is sent off the server.

javascript is only executed when the document is sent and is running on the client.

it's as if you did:

CODE
if ('<script> document.write(window.innerWidth); </script>' < 1008)


which i think will probably yield true most of the time. don't have php now but i think the string evaluates to 0.
snow
post Apr 30 2009, 12:21 PM

Enthusiast
*****
Senior Member
785 posts

Joined: Jan 2003



You have to either do the if else completely in javascript or use javascript to pass the width to php.

Method 1:

<html>
<body>
<script type="text/javascript">
var w = 0;
if (window.innerWidth) w = window.innerWidth;
else if (document.all) w = document.body.clientWidth;
if (w < 1008) { document.write("less than 1008"); }
else { document.write("more than 1008"); }
</script>
</body>
</html>
TSCodeBasic
post Apr 30 2009, 04:45 PM

Getting Started
**
Junior Member
60 posts

Joined: Apr 2009
i still not understand how to write
bubbliblu
post Apr 30 2009, 05:40 PM

Getting Started
**
Validating
127 posts

Joined: Oct 2008
you need something to trigger the javascript like a button click or whatever events...


ExpZero
post May 2 2009, 12:33 AM

Regular
******
Senior Member
1,522 posts

Joined: Mar 2007
From: Kuala Lumpur
QUOTE(CodeBasic @ Apr 30 2009, 11:22 AM)
hi..i wan to ask how to use PHP to check the browser window size ? if let say, my code:

<?
  $myWidth = '<script> document.write(window.innerWidth); </script>';

  echo $myWidth;
     
  if ($myWidth < 1008) { //when i resize the browser window to 1024x768px, the echo $myWidth is 1008
   
    $setWidth = 550;
   
  echo '<div id="Panorama" style="width:'.$setWidth.'px; height:130px;overflow:hidden; background-color: transparent; margin-top:5; padding: 20px; margin-left: 0px;">';
 
  } else { //when i resize the browser window to 1280x800px, the echo $myWidth is 1264
   
  $setWidth = 750;
 
  echo '<div id="Panorama" style="width:'.$setWidth.'px; height:130px;overflow:hidden; background-color: transparent; margin-top:5; padding: 20px; margin-left: 0px;">';   
 
  }?>

My problem is : No matter how i resize the browser window size, it always go to  if ($myWidth < 1008){}...i cant get the $setWidth correctly, anything wrong in my code?
*
QUOTE(CodeBasic @ Apr 30 2009, 04:45 PM)
i still not understand how to write
*
Your $myWidth is a string(which is '<script> document.write(window.innerWidth); </script>') which you cannot compare it with integer. If you want to get the window resolution, you need to do it in javascript then resize the "panorama" in javascript.

EG:
CODE
<script type="text/javascript">
var wwidth = window.innerWidth;
var setwidth;
if(wwidth < 1008)
{
setwidth = 550;
}
else
{
setwidth = 750;
}
document.getElementById('panorama').style.width = setwidth;
</script>
<div id="Panorama" style="height:130px;overflow:hidden; background-color: transparent; margin-top:5; padding: 20px; margin-left: 0px;">


PLEASE TAKE NOTE THAT I NEVER TEST THIS SCRIPT, but it should work.

TSCodeBasic
post May 4 2009, 11:10 AM

Getting Started
**
Junior Member
60 posts

Joined: Apr 2009
But i still face with the problem on doing that cos i just use javascript function to handle scroll left and right...and i used php function to display my image...

public static function DisplayForum($o) {
$forums = self::GetWholeForums();
foreach ($forums as $f) {

$base = $o->forum->id == $f->id ? 'fheader' : 'option';

echo '<td width="25px;" align="center">'
.'<a href="viewforum.php?fid='.$f->id.'">'
.'<img src="/img/forum/'.$base.$f->id.'.gif">'
.'</a>'
.'</td>';

}
}

so what can i do now?

Another question is:

http://i268.photobucket.com/albums/jj20/im...lee1983/ask.jpg
http://i268.photobucket.com/albums/jj20/im...ee1983/ask2.jpg
http://i268.photobucket.com/albums/jj20/im...ee1983/ask3.jpg
http://i268.photobucket.com/albums/jj20/im...ee1983/ask4.jpg

How can make the image displayed in center or scroll left a bit so that can see the image display? Bcos i don wan ppl to scroll right again after they click the image

This post has been edited by CodeBasic: May 4 2009, 11:11 AM

 

Change to:
| Lo-Fi Version
0.0175sec    0.99    5 queries    GZIP Disabled
Time is now: 14th December 2025 - 01:50 AM