troubleshooting Question

How to get browser width & <div> left position using Javascript

Avatar of sidhi
sidhi asked on
Scripting LanguagesJavaScriptHTML
6 Comments1 Solution3945 ViewsLast Modified:
OK, I have some problems here :
 1. First, I want to detect my javascript compatinlity for Mozilla or IE ?
 2. Second, I want to find know what's the browser width (based on the browser detected) and calculated it.
 3. Third, I want to set my <div> layer's left position with the value i just calculated in no.2

Here's the script that I try. Result of my scipts :
 I can detect the browsers (IE or Mozilla), in other words, no problem with no.2
 Then in Mozilla I can done no2 calculations. But in IE no2 is an error.
 And i still can not change the <div> left position value with the value i calculate.
 
 Can anyone help me fix my javascript ? Or maybe got a better script for my problems ?
 
PS: no ASP, no .NET, no PHP, just Javascript.

Thanks.
<html><head>
<script language="javascript" type="text/javascript">
function windowsize()
{
  var noPx = document.childNodes ? 'px' : 0;
  var browserName=navigator.appName; 
  if (browserName=="Netscape") { i=Math.round((window.innerWidth-945)/2); } 
  if (browserName=="Microsoft Internet Explorer")
  {   
    alert(document.body.offsetWidth);
    i=Math.round((document.documentElement.clientWidth-945)/2); //Get Web Browser Width in IE ???
  }
  else
  {
    i=Math.round((screen.width-945)/2); //Get Screen Width for other browser
  }
 
  if (i<1) {i=1;}  
  alert(i);
  myReference = getRefToDiv( 'maiboard' );
  myReference.left = i + noPx; //left position for the mainboard layer.
//  document.getElementById("mainboard").style.left = i + noPx;  //--> shoud i use this ??
}
 
windowsize();
</script>
</head>
<body>
 
<div name="mainboard" style="position:absolute; top:5px; z-index:3;">
  <table cellpadding="0" cellspacing="0" border="0">
  <tr height="144">
    <td align="center" valign="top">
      <br style="line-height:120%;" />
      <h1>TEST</h1>
    </td>
  </tr>
  </table>
</div>
</body></html>
ASKER CERTIFIED SOLUTION
quincydude

Our community of experts have been thoroughly vetted for their expertise and industry experience.

Join our community to see this answer!
Unlock 1 Answer and 6 Comments.
Start Free Trial
Learn from the best

Network and collaborate with thousands of CTOs, CISOs, and IT Pros rooting for you and your success.

Andrew Hancock - VMware vExpert
See if this solution works for you by signing up for a 7 day free trial.
Unlock 1 Answer and 6 Comments.
Try for 7 days

”The time we save is the biggest benefit of E-E to our team. What could take multiple guys 2 hours or more each to find is accessed in around 15 minutes on Experts Exchange.

-Mike Kapnisakis, Warner Bros