javascript help - window width

**kbjradmin** · 10-29-2008 03:42 PM

i need a script that will determine the inner width of a browser window. i tried this

Code:

winwidth=document.all?document.body.clientwidth:window.innerwidth;
padding = (winwidth-1000)/2;
document.write("<div style=\"position:absolute;top:25px;left:" + padding + "px;\">");

but it doesn't seem to work. it isn't reporting an error, but not working either.

if you can fix this code or give me a new one, i don't care which, just help.

**Jake** · 10-29-2008 03:51 PM

I think you are looking for something like this?
http://www.howtocreate.co.uk/tutoria.../browserwindow

Code:

if( typeof( window.innerWidth ) == 'number' ) {
    //Non-IE
    myWidth = window.innerWidth;
  } else if( document.documentElement && document.documentElement.clientWidth ) {
    //IE 6+ in 'standards compliant mode'
    myWidth = document.documentElement.clientWidth;
  } else if( document.body && document.body.clientWidth ) {
    //IE 4 compatible
    myWidth = document.body.clientWidth;
  }

should work,
also why are you doing this anyway?

**xmakina** · 10-30-2008 05:05 AM

If this is for a CSS Div might I recommend you do away with it? CSS can use percentages for width, you know, and then the browser will adjust if the window size is changed.

I'm guessing you want a box with some border around it, use

Code:

div#container{
	padding:25px;
	background-color:red;
}
div#header{
	background-color:green;
}
div#content{
	background-color:blue;
}
div#footer{
	background-color:yellow;
}

with

HTML Code:

<html>
	<head>
		<title>WriterSite</title>
		<link rel="stylesheet" type="text/css" href="style.css" />
	</head>
	
	<body>
		<div id="container">
			<div id="header">
				<p class="navigation">WriterSite</p>
				<h1>Welcome</h1>
			</div>
			<div id="content">
				<p>This website is for Omnisoft WriterSite</p>
			</div>
			<div id="footer">
				<p>Copyright (C) Me 2008</p>
			</div>
		</div>
	</body>
</html>

**kbjradmin** · 10-30-2008 09:56 AM

thank you, i will try these. i want a div that is centered regardless of browser size.

**xmakina** · 10-30-2008 10:46 AM

Just use

Code:

padding:auto;

**kbjradmin** · 10-30-2008 12:17 PM

i've never heard of using auto in padding. does it center it?
Edit:
jake, your code worked. thank you.

**xmakina** · 10-30-2008 05:44 PM

yes - auto centres the div. I'm just thinking you should avoid JScript where possible as people like myself use NoScript a lot and it can really cause a site to look awful if the developer loves their JScript

**Jake** · 10-30-2008 06:39 PM

It all depends, there are times when it is useful... the difference is that if you wanted to say make a popup using ajax that pops up in the middle of the screen this javascript is good for finding the center. However if its a normal website you can use css...

margin: auto; would center the whole thing in the middle

margin 10px auto; would center it width-wise while staying 10 pixels down from the top of the browser window.

Thread: javascript help - window width

LinkBack

Thread Tools

Display

javascript help - window width

Re: javascript help - window width

Re: javascript help - window width

Re: javascript help - window width

Re: javascript help - window width

Re: javascript help - window width

Re: javascript help - window width

Re: javascript help - window width

Similar Threads

300 short cuts of Windows XP

drop down menus with JavaScript disabled?

javascript and external javascript files problem

XML and Javascript

Some nice-simple JavaScript effects !!

Posting Permissions