[Okta Webinar] Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 1007
  • Last Modified:

DIV tag placement

I have written a function to show a DIV tag and place it to the middle of the screen. The DIV tag is 750px wide - so lines 2 and 3 work out how wide the window is, and the value of the DIV tag's left property.

This all works fine in FireFox, but not in internet explorer! This bit is in a seperate .js file:

function showdivtag (tagname) {
      var screenwidth = window.innerWidth / 2;
      var leftside = screenwidth - 375;
      var obj = document.getElementById(tagname);
            obj.style.left = leftside;
            obj.style.visibility = "visible";
}

and it is called (after being linked with <script SRC="page.js" etc etc>) with this:

<a onMouseDown="showdivtag('history')"><img src="history.gif"></a>

The problem is that line 5 (obj.style.left = total;) doesn't work in Internet Explorer! It comes up with an error saying "Invalid Argument". Although, the script works fine in FireFox.

Please help me with this! Many Thanks!
0
mrtjacobs
Asked:
mrtjacobs
  • 4
  • 2
1 Solution
 
lil_puffballCommented:
In ie I believe you need:

screen.width

so your code would be:

function showdivtag (tagname) {
     var screenwidth = ie?screen.width/2:window.innerWidth / 2;
     var leftside = screenwidth - 375;
     var obj = document.getElementById(tagname);
          obj.style.left = leftside;
          obj.style.visibility = "visible";
}
0
 
lil_puffballCommented:
oops, forgot a line:

unction showdivtag (tagname) {
     ie=document.all;
     var screenwidth = ie?screen.width/2:window.innerWidth / 2;
     var leftside = screenwidth - 375;
     var obj = document.getElementById(tagname);
          obj.style.left = leftside;
          obj.style.visibility = "visible";
}
0
 
mrtjacobsAuthor Commented:
Great! That fixed it! Although, would you care to roughly explain what that code actually does?

Many Thanks!
0
What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

 
devicCommented:
var screenwidth = window.innerWidth? window.innerWidth/2:document.body.clientWidth/2;
0
 
lil_puffballCommented:
Thanks for the points and the A. :)

Basically, screenwidth is half the width of the screen. I guess the popup is 750 px width (375*2) so you subtract 375 from half the screen width. And that's the left position of the div. So you effectively centre it...
It's hard to tell without the html, but I think that's what it basically does. :)
0
 
mrtjacobsAuthor Commented:
Ah, i knew that... I wrote the whole code from scratch!

Just the bit you added, where you put

     ie=document.all;
     var screenwidth = ie?screen.width/2:window.innerWidth / 2;

in place of

     var screenwidth = window.innerWidth / 2;

... i guess it just uses screen.width if the browser is IE, else it uses window.innerWidth?

No problem with the A and the points, you gave me a working answer within 10 minutes so you deserved it!
0
 
lil_puffballCommented:
Oops. x_x
In that case, you're absolutely correct. document.all is an IE only thing, and IE only uses screen.width, so it's safe to check for IE with document.all...though you might know that too... :P
0

Featured Post

Upgrade your Question Security!

Add Premium security features to your question to ensure its privacy or anonymity. Learn more about your ability to control Question Security today.

  • 4
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now