Why can't I manipulate display:none in opera 6?

**neil100** · Oct 27, 2002, 15:32

The code below hides and shows the layer when you click the link, it works fine in IE and ns6, does anyone know why it doesn't work in opera 6, thanks for any suggestions.

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript" type="text/JavaScript">
var layerOn = 1;

function removeLayer() {
	if (layerOn){
		document.getElementById('layer1').style.display = 'none';
		layerOn = null;
	} else {
		document.getElementById('layer1').style.display = 'block';
		layerOn = 1;
	}
}
</script>

<style type="text/css">
<!--
#layer1 {
	position:relative;
	left:50px;
	width:150px;
	height:150px;
	background-color:#ff0000;
	display:block;
	color:#ffffff;
	padding:15px;
}
body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #666666;
	margin-left:40px;
}
-->
</style>
</head>
<body>

<br /><br />
<a href="#" onclick="removeLayer();return false">click here to show or hide the layer</a>
<br /><br /><br />
<div id="layer1">My Layer</div>

</body>
</html>

**blufive** · Oct 27, 2002, 16:49

Opera 6 (and below) have... um... suboptimal DOM support. Opera 7 will apparently be much better.

I messed about with stuff like this a few months back, I'll try to look at the script when I'm in the same building* tomorrow and see if I can be more helpful.

*Though I wrote the script in quesion in about February, it's still not live, so it only exists on internal development servers...

**blufive** · Oct 28, 2002, 14:45

Right, apologies for the delay.

This page:
http://www.opera.com/docs/specs/
Gives a comprehensive list of what is and isn't supported by Opera. As you will see about half way down the page, support for javascript manipulation of the DOM is pretty thin. Opera have indicated that version 7 will be much better.

The closest you've got for now is to play with visibility, e.g.

Code:

document.getElementById('layer1').style.visibility = "hidden";
[...]
document.getElementById('layer1').style.visibility = "visible";

Unfortunately, the element will still occupy space on the page, though if it's an absolutely-positioned div, this shouldn't be a problem.

My script was using absolutely positioned divs, so this was good enough for me.

**neil100** · Oct 28, 2002, 17:42

Thanks for the reply blufive, unfortunately I can't use visibility instead, because I am using it to create a simple collapsable menu, so I have to use relative positioning. It looks like opera users will just have to suffer the uncollapsed version.

**blufive** · Oct 29, 2002, 13:13

Yeah, for that kind of thing, you've had it, I think. Roll on opera 7...

The SitePoint Forums have moved.

User Tag List

Thread: Why can't I manipulate display:none in opera 6?

Thread Tools

Display

Why can't I manipulate display:none in opera 6?

Bookmarks

Bookmarks

Posting Permissions