Page 1 of 1

Get Resolution

Posted: Mon Jul 24, 2006 11:40 am
by calufa
Is there any way to get the screen resolution and then using that number set a table position?

Lets say i need it to get a resolution number and then divide it by 2 and add a 200px to that position of a table, how can i do that?

Thank in advanced

Posted: Mon Jul 24, 2006 11:45 am
by RobertGonzalez
Yes, but it would be done client-side not server-side. This should go in the client-side forum.

This is some code that I snagged from a site I was using that did what you are asking for. Not sure it'll work for you, but it may be a good starting point.

Code: Select all

<script language="javascript">
if(screen.width == 1024)
{
	document.write("<TD COLSPAN=3><IMG src='images/banner1024_Logon.jpg' border=0></TD>");
}
else if (screen.width == 800)
{
	document.write("<TD COLSPAN=3><IMG src='images/banner800_Logon.jpg' border=0></TD>");
}
else if (screen.width == 1152)
{
	document.write("<TD COLSPAN=3><IMG src='images/banner1152_Logon.jpg' border=0></TD>");
}
else
{
	document.write("<TD COLSPAN=3><IMG src='images/banner1280_Logon.jpg' border=0></TD>");
}
</script>

Posted: Mon Jul 24, 2006 11:48 am
by Chris Corbyn
Does PHPSniff maybe do this? It will require some client-side scripting yes.

We did some stats gathering recently and I used this effectively (http is an XMLHttpRequest object):

Code: Select all

function sendBrowserInfo()
{
        var sw = screen.width;
        var sh = screen.height;
        var uN = navigator.appName;
        var uV = navigator.appVersion;
        var uA = navigator.userAgent;
        try {
                http.open("GET", 'log_browser_stats.php?w='+sw+'&h='+sh+'&un='+uN+'&uv='+uV+'&ua='+uA, true);
                http.send(false);
        } catch (e) {
                //
        }
}

sendBrowserInfo();
:)

Posted: Mon Jul 24, 2006 12:02 pm
by choppsta
As with most things on the client side, there are cross browser issues. Here's a page with more info: http://www.howtocreate.co.uk/tutorials/ ... wserwindow

You mention altering the "position" of a table so I presume you're talking about absolute positioning. In this case, once you've calculated the position value you could do something like:

Code: Select all

document.getElementById('myTable').style.left = myPositionValue;
If you're doing anything with Javascript, you MUST bookmark this website: http://www.quirksmode.org/. It will save you much pain.

Posted: Mon Jul 24, 2006 12:02 pm
by daedalus__
omg, is it that easy to make remote script calls?

Posted: Mon Jul 24, 2006 12:08 pm
by choppsta
Daedalus- wrote:omg, is it that easy to make remote script calls?
It's even easier if you use images.

Code: Select all

var img = document.createElement('img');
img.src = 'http://www.website.com/myScript.php?x='+myData;
Check out the Google Analytics code: http://www.google-analytics.com/urchin.js

Posted: Mon Jul 24, 2006 12:24 pm
by feyd
Javascript != PHP :arrow: Client Side.

Posted: Mon Jul 24, 2006 1:13 pm
by calufa
Thanks to all up there,

but this doesnt work

Code: Select all

<script language="javascript">
if(screen.width == 1024)
{
        document.write("<div id="Layer1" style="position:absolute; width:200px; height:296px; z-index:1; left: 190; top: 25%;"><img src="principal0001.png" width="621" height="295"></div>");
}
else if (screen.width == 800)
{
        document.write("<TD COLSPAN=3><IMG src='images/banner800_Logon.jpg' border=0></TD>");
}
else if (screen.width == 1152)
{
        document.write("<TD COLSPAN=3><IMG src='images/banner1152_Logon.jpg' border=0></TD>");
}
else
{
        document.write("<TD COLSPAN=3><IMG src='images/banner1280_Logon.jpg' border=0></TD>");
}
</script>
Can i so something like this?

Code: Select all

<script language="javascript">
var thewidth = screen.width/2 - 200

document.write("<div id="Layer1" style="position:absolute; width: thewidth; height:296px; z-index:1; left: 190;)
</script>
Hehe i dont know anything about php or java i am just a flash programmer.

Posted: Mon Jul 24, 2006 2:17 pm
by daedalus__
that's javascript, not java. they are two different things

you should be able to do something like that, but i am wondering, if you are assigning that div an id, why are you using inline css?

Posted: Mon Jul 24, 2006 2:21 pm
by RobertGonzalez
calufa, why not start small? Try a single variant of the screen.width property and see if that is working. It may be something else causing problems.

Code: Select all

<script language="javascript">
if (screen.width == 1024)
{
    alert('Holy cow, we have a 1024 here!');
} 
</script>

Posted: Mon Jul 24, 2006 2:53 pm
by calufa
Everah i will like to use that but i have a layer where i want to add text and have it center in the screen, i was to make something like this:

http://www.azcarivolante.com/gds

I want that my text is always in the middle and haveing a backgound image always fullscreen and if i scale the browser that he identifies the stage size and recalculate it automatelly.

Posted: Tue Jul 25, 2006 2:22 am
by choppsta
calufa wrote: Can i so something like this?

Code: Select all

<script language="javascript">
var thewidth = screen.width/2 - 200

document.write("<div id="Layer1" style="position:absolute; width: thewidth; height:296px; z-index:1; left: 190;)
</script>
Hehe i dont know anything about php or java i am just a flash programmer.
If you're a Flash Programmer you should have no trouble picking up Javascript as both Actionscript and Javascript are both based on ECMAScript.

Like I said in my previous post, you have problems with your method:

1. You're using the screen width and not the browser window width which might be completely different. You're also obtaining the width through a browser specific method, so you'll get limited compatibility there.
2. You're using document.write which should really be avoided. Use the DOM methods to create or manipulate elements. Like I suggested, you would then only need to change one style value on the element in question. E.g.

Code: Select all

document.getElementById('Layer1').style.width = thewidth;
3. You method doesn't work if the user then changes the size of their browser window.