0

hey guys does anyone know why i got an 'undefined invisArr in for loop' in my javascript code?
I've got 3 div boxes in an absolute position and i m trying to make it visible whene i m presing one or two or three links.

//

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript" src = "web_function.js"/></script>
<style type="text/css">
.owrapper { position:relative; width:75%; margin:0 auto;}
.wrapper { position:absolute; width:30%; padding:0 0.25em; margin:0.25em; border: thick dotted #99FF00; background-color:#FFF; }
h1 {
	text-align:center;
	
	}


</style>
</head>

<body>
<h1>Javascript Examples</h1>
<p><a href="#" onclick="makeVisible('one'['two', 'three'])">one</a> 
<a href="#" onclick="makeVisible('two'['one', 'three'])">two</a> 
<a href="#" onclick="makeVisible('three'['two', 'one'])">three</a></p>
<div class="owrapper">
	<div id="wrapper1" class="wrapper" onmouseover= "changeColour(this.id, 'red')" onmouseout= "changeColour(this.id, 'black')">
		<p> One<br />
        Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin sodales   nulla. Vivamus iaculis massa quis augue. In porta ligula feugiat lacus.   Nullam ullamcorper dapibus pede. Cum sociis natoque penatibus et magnis   dis parturient montes, nascetur ridiculus mus. Suspendisse scelerisque   viverra tortor. Aliquam erat volutpat. Suspendisse et nisl eu nisl   pellentesque lacinia. Suspendisse mi lorem, viverra eleifend, pharetra   eu, ornare vel, sem. Proin urna justo, dictum at, fermentum laoreet,   interdum sit amet, nisl. Nulla molestie sodales lacus. Phasellus non   nisi	
        </p>
  </div>
    	
  <div id="wrapper2" class="wrapper" onmouseover= "changeColour(this.id, 'blue')" onmouseout= "changeColour(this.id, 'black')">
			<p> Two <br />
            Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin sodales   nulla. Vivamus iaculis massa quis augue. In porta ligula feugiat lacus.   Nullam ullamcorper dapibus pede. Cum sociis natoque penatibus et magnis   dis parturient montes, nascetur ridiculus mus. Suspendisse scelerisque   viverra tortor. Aliquam erat volutpat. Suspendisse et nisl eu nisl   pellentesque lacinia. Suspendisse mi lorem, viverra eleifend, pharetra   eu, ornare vel, sem. Proin urna justo, dictum at, fermentum laoreet,   interdum sit amet, nisl. Nulla molestie sodales lacus. Phasellus non   nisi.
            	</p>
            </div>
            
			<div id="wrapper3" class="wrapper" onmouseover= "changeColour(this.id, 'green')" onmouseout= "changeColour(this.id, 'black')">
            	<p> Three <br />
                    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin sodales   nulla. Vivamus iaculis massa quis augue. In porta ligula feugiat lacus.   Nullam ullamcorper dapibus pede. Cum sociis natoque penatibus et magnis   dis parturient montes, nascetur ridiculus mus. Suspendisse scelerisque   viverra tortor. Aliquam erat volutpat. Suspendisse et nisl eu nisl   pellentesque lacinia. Suspendisse mi lorem, viverra eleifend, pharetra   eu, ornare vel, sem. Proin urna justo, dictum at, fermentum laoreet,   interdum sit amet, nisl. Nulla molestie sodales lacus. Phasellus non   nisi
   	          </p>
  </div>		
</div>
</body>
</html>





// JavaScript Document

function changeColour( id , colour){
	var elem = document.getElementById(id);
	elem.style.color = colour;
	
	
	}

function makeVisible( Vid, invisArr){
	
	var elemVis = document.getElementById(Vid);
	var hiddenElement;
	for (var n=0; n < invisArr.length; n++){
		
		hiddenElement = document.getElementById(invisArr[n]);
		hiddenElement.style.visibility = hidden;
		
		
		}
	elemVis.style.visibility = visible;
}
2
Contributors
2
Replies
4
Views
5 Years
Discussion Span
Last Post by marios_neo
1

Thanks mate!! if someone need the code just change the 'DIV's id' to one,two,three.

<div class="owrapper">
	<div id="one" class="wrapper" onmouseover= "changeColour(this.id, 'red')" onmouseout= "changeColour(this.id, 'black')">
		<p> One<br />
        Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin sodales   nulla. Vivamus iaculis massa quis augue. In porta ligula feugiat lacus.   Nullam ullamcorper dapibus pede. Cum sociis natoque penatibus et magnis   dis parturient montes, nascetur ridiculus mus. Suspendisse scelerisque   viverra tortor. Aliquam erat volutpat. Suspendisse et nisl eu nisl   pellentesque lacinia. Suspendisse mi lorem, viverra eleifend, pharetra   eu, ornare vel, sem. Proin urna justo, dictum at, fermentum laoreet,   interdum sit amet, nisl. Nulla molestie sodales lacus. Phasellus non   nisi	
        </p>
  </div>
    	
  <div id="two" class="wrapper" onmouseover= "changeColour(this.id, 'blue')" onmouseout= "changeColour(this.id, 'black')">
			<p> Two <br />
            Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin sodales   nulla. Vivamus iaculis massa quis augue. In porta ligula feugiat lacus.   Nullam ullamcorper dapibus pede. Cum sociis natoque penatibus et magnis   dis parturient montes, nascetur ridiculus mus. Suspendisse scelerisque   viverra tortor. Aliquam erat volutpat. Suspendisse et nisl eu nisl   pellentesque lacinia. Suspendisse mi lorem, viverra eleifend, pharetra   eu, ornare vel, sem. Proin urna justo, dictum at, fermentum laoreet,   interdum sit amet, nisl. Nulla molestie sodales lacus. Phasellus non   nisi.
            	</p>
            </div>
            
			<div id="three" class="wrapper" onmouseover= "changeColour(this.id, 'green')" onmouseout= "changeColour(this.id, 'black')">
            	<p> Three <br />
                    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin sodales   nulla. Vivamus iaculis massa quis augue. In porta ligula feugiat lacus.   Nullam ullamcorper dapibus pede. Cum sociis natoque penatibus et magnis   dis parturient montes, nascetur ridiculus mus. Suspendisse scelerisque   viverra tortor. Aliquam erat volutpat. Suspendisse et nisl eu nisl   pellentesque lacinia. Suspendisse mi lorem, viverra eleifend, pharetra   eu, ornare vel, sem. Proin urna justo, dictum at, fermentum laoreet,   interdum sit amet, nisl. Nulla molestie sodales lacus. Phasellus non   nisi
   	          </p>
  </div>		
</div>
</body>
</html>
This question has already been answered. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.