ansaurus

Question

style.display not working in Firefox, Opera, Safari - IE7 OK

Answer 1

+1 A:

Check the error console (Tools Menu > Error Console in Firefox 3) to make sure that there isn't another error happening that you're not seeing, which is stopping your script from working.

DannySmurf 2008-08-13 21:05:23

Answer 2

A:

@DannySmurf - Good idea, but no errors are showing up

@pix0r - Thanks, but as I mentioned I've tried this.

@buyutec - Working on it. I can't post the actual content here, and there are a lot of js files that the framework (Sharepoint based, I have no control over it) generates - if all of those references are broken the show/hide actually does work in FF3. It's a lot of junk to sort through though, so I was hoping someone knew of specific things to look for.

palmsey 2008-08-13 21:07:37

Answer 3

+2 A:

Can you provide some markup that reproduce the error? Your situation must have something to do with your code since I can get this to work on IE, FF3 and Opera 9.5:

<html>
<head>
<script>
function show()
{
    var d = document.getElementById('testdiv');
    d.style.display = 'block';
}
</script>
</head>
<body>
<div id="testdiv" style="position: absolute; height: 20px; width: 20px; display:none; background-color:Red;">
</div>
<a href="javascript:show();">Click me</a>
</body>
</html>

Serhat Özgel 2008-08-13 21:10:41

Answer 4

+1 A:

Try setting the height and width of the div, and make sure it is on top by setting its z-index higher than everything else. If the absolutely positioned div is inside an element that is relatively positioned, it's top and left location is based off the top and left of the relatively positioned element. Try putting your div just under the body element.

Lance Fisher 2008-08-13 23:36:09

Answer 5

+2 A:

Since setting the properties with javascript never seemed to work, but setting using Firebug's inspect did, I started to suspect that the javascript ID selector was broken - maybe there were multiple items in the DOM with the same ID? The source didn't show that there were, but looping through all divs using javascript I found that that was the case. Here's the function I ended up using to show the popup:

function openPopup(popupID)
{
  var divs = getObjectsByTagAndClass('div','popupDiv');
  if (divs != undefined && divs != null)
  {
    for (var i = 0; i < divs.length; i++)
    {
      if (divs[i].id == popupID)
        divs[i].style.display = 'block';     
    }
  }
}

(utility function getObjectsByTagAndClass not listed)

Ideally I'll find out why the same item is being inserted multiple times, but I don't have control over the rendering platform, just its inputs.

So when debugging issues like this, remember to check for duplicate IDs in the DOM, which can break getElementById.

To everyone who answered, thanks for your help!

palmsey 2008-08-14 15:23:10

By that, if you mean you had multiple id names on the same page, that is invalid as id names may only appear once on a page and must be unique to one element.

Rob 2009-11-21 21:15:55

Answer 6

+1 A:

Found the answer : I need to use the following to make it work on both browsers :

document.getElementById('editRow').style.display = '';

2009-05-29 16:55:29

Answer 7

A:

There is an annoying display error on Firefox 3.5 but not on IE7 or Firefox 2.0.9

I have 3 DIV's position absolute - the first with plain text; the second with a CSS menu (sucklefish type with UL and LI) and the third ditto. The third will not display at all even though the coding has been checked and found to be perfect with W3C's HTML validator.

As a temporary measure, I have merged the second and third DIV's contents.

Things must be bad at Mozilla when IE7 and FF2 display OK but not FF 3.5

Paul 2009-11-21 21:10:04

Then your markup must be worse because if your markup works in IE but not FF then your markup is the problem. But start your own thread and show us what you've got so we can fix it for you.

Rob 2009-11-21 21:17:45

Answer 8

A:

I am trying to run the following code. It works great on IE but doesnt work on Firefox. Whats the problem. Anyone please help. this is driving me crazy!!!

var id1; function StartGlide() { document.getElementById("Banner").style.pixelLeft = document.body.offsetWidth; document.getElementById("Banner").style.visibility = "visible"; id1 = window.setInterval(Glide,150); } function Glide() { document.getElementById("Banner").style.pixelLeft -= 10; if (document.getElementById("Banner").style.pixelLeft

Hello World

Stop

Janet 2010-07-16 21:51:15

ansaurus

tags:

views:

answers:

style.display not working in Firefox, Opera, Safari - IE7 OK

related questions