Hi.

 

I'm trying to use some code to hide/unhide divs that occupy the same space on the screen so that the content is selected by clicking a relevant link in another div.

 

it's working, sort of, but I need to add some script to close the last unhidden div when another link is clicked.

 

currently the new unhidden divs appear below the previous ones unless they are re-clicked to close em :-S

 

the page in question is here: http://www.philtinsley.com/about.html

(i've just sent the updated pages to the server but if you get 'under construction' writen in the middle of the page, you're seeing the old one)

 

any help very much appreciated :-)

Hi.

 

I'm trying to use some code to hide/unhide divs that occupy the same space on the screen so that the content is selected by clicking a relevant link in another div.

 

it's working, sort of, but I need to add some script to close the last unhidden div when another link is clicked.

 

currently the new unhidden divs appear below the previous ones unless they are re-clicked to close em :-S

 

the page in question is here: http://www.philtinsley.com/about.html

(i've just sent the updated pages to the server but if you get 'under construction' writen in the middle of the page, you're seeing the old one)

 

any help very much appreciated :-)

 

you could just define a variable outside of the function and increment it each time the function is called, then just set the div you clicked's zIndex to the new value of your variable. Its a kinda messy way tho.

 

alternatively, you could use the getElements by Class name script (http://www.robertnyman.com/2005/11/07/the-...ntsbyclassname/), hide all the returned objects, then show the selected one.

 

Otherwise, you'd have to crawl the DOM or something

 

is that any help?

errrr I'm afraid you're talking to a javascript nooby here. I've never knowingly crawled a DOM or returned an object (unles library books count?)

 

I looked at the page you cited above but I think I must of had my browser set to Swahili coz I didn't understand any of it...

 

Maybe instructions along the lines of: add 'this' to 'here', or maybe 'scrap what you've done and cut and paste this in its place' would be more suitable for my level of skill?

 

Thanks, Phil.

ah, ok, maybe this will work?

 

 

 

function unhide(divID) {
divs = getElementsByClassName("hidden");
for(var t=0;t<divs.length;t++){
   divs[t].className="hidden";
}

var item = document.getElementById(divID);
if (item) {
	item.className="unhidden";
}
}

function getElementsByClassName(className, tag, elm){
var testClass = new RegExp("(^|\\\\s)" + className + "(\\\\s|$)");
var tag = tag || "*";
var elm = elm || document;
var elements = (tag == "*" && elm.all)? elm.all : elm.getElementsByTagName(tag);
var returnElements = [];
var current;
var length = elements.length;
for(var i=0; i<length; i++){
	current = elements[i];
	if(testClass.test(current.className)){
		returnElements.push(current);
	}
}
return returnElements;
}

 

Just a warning though, it probably won't.

 

Also, technically, this is a little inefficient, as it should really not bother changing one, just to change it back.

 

I'm not sure of the following syntax, so its probably where it'll go wrong; item.className=(item.className=='hidden')?'unhidden':'hidden';

 

EDIT: Just changed some of the code a bit, will be more likely to work now

"Just a warning though, it probably won't"

 

mmm, as a nooby I'm a bit hesitant to add code that may not work (coz I won't know how to fix it), I'll give it a try though...