How do you find the browsers position onscreen

digijin · Feb 15, 2006

hi Guys,

I've got a client that wants a site made where (its kinda hard to explain, bear with me) the website is in multiple browser windows, like navigation in one window, content in another, text in another,

Anyway I can handle passing all the data around, but the thing that I cant figure out is how do you tell what the on-screen position of a browser window is? I need to make it so that the navigation window is next to the content window, so if you move the navigation window the content window should follow, I need to do something like

contentWindow.moveTo(navWindow.onScreenXpos,navWindow.onScreenYpos+something)

but I dont know how to find something like onScreenYPos

hope that makes some sense,

thanks for your time!~

James

BillyRayPreachersSon · Feb 16, 2006

This page might help you a lot:

http://www.quirksmode.org/viewport/compatibility.html

Although it seems to be quite hard to find the actual top-left of the browser window in IE (there are no properties that I can find to do this). So, a little JavaScript is in order, and as long as you can put up with a momentary flicker of the window (in IE only), then this will get that position for you.

I've tested the script working in IE6, Fx1.5, NN7.2. It probably won't work in Opera, even though you can read "screenLeft" and "screenTop", as the moveTo method is not supported.

Code:

<html>
<head>
	<title>Main Window</title>

	<script type="text/javascript">
	<!--

		var navWindowHandle = null;
		function findCoordinates() {

			var chromeWidth = chromeHeight = 0;
			var browserX = browserY = null;

			// Find dimensions of chrome in IE
			if (document.all) {
				var currentX = screenLeft;				// store current position of upper-left corner of document (excluding chrome)
				var currentY = screenTop;
				moveTo(0, 0);							// move browsder window to top-left of screen
				chromeWidth = screenLeft;				// find the width and height of the chrome
				chromeHeight = screenTop;
				browserX = currentX - chromeWidth;
				browserY = currentY - chromeHeight;
				moveTo(browserX, browserY);				// return the browser to its previous position
			} else if (window.screenX) {
				browserX = window.screenX;
				browserY = window.screenY;
			}

			if (browserX != null) {
				alert('Browser window is at: ' + browserX + ', ' + browserY);
			} else {
				alert('Unable to determine browser coordinates');
			}
		}

	//-->
	</script>
</head>
<body>
	<a href="javascript:findCoordinates();">Find Window Coordintates</a>
</body>
</html>

Hope this helps,
Dan

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

BillyRayPreachersSon · Feb 16, 2006

Hmm... the comment:

Code:

// store current position of upper-left corner of document (excluding chrome)

is misleading. It should really say:

Code:

// store current position of upper-left corner of document ([!]including[/!] chrome)

Dan

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

digijin · Feb 16, 2006

BillyRay,

You, my dear sir, are a genius.

Thanks for your help, the flicker might be a little bit of a problem, but its better than what I would have to resort to if I couldnt find browser position.

James

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

How do you find the browsers position onscreen

digijin

Programmer

BillyRayPreachersSon

Programmer

BillyRayPreachersSon

Programmer

digijin

Programmer

Similar threads

Part and Inventory Search

Sponsor