Web Wiz - Green Windows Web Hosting
Web Wiz Homepage Search Web Wiz

  New Posts New Posts RSS Feed - hiding a stack of divs
  FAQ FAQ  Forum Search   Events   Register Register  Login Login

Topic Closedhiding a stack of divs
 Post Reply Post Reply Page  12>
Author
  Topic Search Topic Search  Topic Options Topic Options
ctoz View Drop Down
Newbie
Newbie


Joined: 26 May 2005
Location: Australia
Status: Offline
Points: 7 		Direct Link To This Post Topic: hiding a stack of divs
    Posted: 27 May 2005 at 1:36am

I have a page which uses a series of divs which start hidden and are made visible with an onClick...these layers illustrate points in the main text.

The OnClick also hides the div/s made visible by adjacent links, so it allows for a bit of non-sequential viewing.  There's also a "hide all" link, which sits at the top of the z-index stack,  and has the whole bunch of layer ids attached individually.
 
It really needs something more economical -- a function that would identify all the  layers within a range of z-indexes and hide them; so that the onClick commands would become 'hide all the overlays'; show 'this overlay';.
 
The basic hide/show script is:
 
//   **********  changing layers , from  Brad Hedge's Code_Punk.net
function box(boxname,menustate)
 {
 if (document.getElementById) {document.getElementById(boxname).style.visibility = menustate }
 }
 
but I'm stumped about how to code the function, what to do to identify the necessary divs by z-index. Any pointers for this cut'n'paster would be welcome...
 
example at
 
Back to Top
ub3rl337ch3ch View Drop Down
Senior Member
Senior Member
Avatar

Joined: 16 February 2005
Location: Australia
Status: Offline
Points: 341 		Direct Link To This Post Posted: 29 May 2005 at 9:14pm

you can read zindex in js by using

var something
something = document.layer.zIndex
 
you'd set up a function along the lines of
 
getallxindex(startindex,endindex){
var tempindex
tempindex = document.layer1.zIndex
if startindex < tempindex < endindex{
//do the visibilty change thingy
}
tempindex = document.layer2.zIndex
if startindex < tempindex < endindex{
//do the visibility thingy
}
}
 
where startindex and end index are the zIndex's that you want to find layers between.
 
the obvious drawback of this is that it requires that you code an if for each inidividual layer and doesn't cascade for any new layers... but its the best i can think of.
Back to Top
ctoz View Drop Down
Newbie
Newbie


Joined: 26 May 2005
Location: Australia
Status: Offline
Points: 7 		Direct Link To This Post Posted: 30 May 2005 at 3:02am
Thank you ub3... but it looks almost as formidable as my hand-coded version. There must be a way to not have to code all those "if" statements, some sort of array maybe? any other takers?
 
 
Back to Top
ub3rl337ch3ch View Drop Down
Senior Member
Senior Member
Avatar

Joined: 16 February 2005
Location: Australia
Status: Offline
Points: 341 		Direct Link To This Post Posted: 30 May 2005 at 7:35pm
i don't know the exact coding or if its even possible, but i'm gueesing you could code all of your layers into a string like this:
 
var layers
layers = ';layer1;layer2;layer3;layer4;'
 
then do a count for each bit of text between the ;'s soemthing like (here is where the code IS wrong, but you get the gist)
 
var countoflayers
countoflayers = count(';',';')
 
then do a loop a number of times equal to countoflayers where you sub in the part between the ;'s for the layer name in the code i wrote above.
 
don't know if that is possible, probably easier (more likely to be doable) in asp, which is where i spend most of my time...
 
alternately you could just do this:
 
getallxindex(layername,startindex,endindex){
var tempindex
tempindex = document.layername.zIndex
if startindex < tempindex < endindex{
//do the visibilty change thingy
}
}
 
and call that function for each layer... maybe make it quicker to type in by hardcoding the startindex and endindex where possible...
 
 
either that or i could stop pretending i know what i'm talking about... LOLTongue
Back to Top
ctoz View Drop Down
Newbie
Newbie


Joined: 26 May 2005
Location: Australia
Status: Offline
Points: 7 		Direct Link To This Post Posted: 30 May 2005 at 8:08pm
Code_Punk came through with a simple solution...I thought he'd gone bush:
 
give each of the layers to be hidden the same class and then hide the class--
 
document.getElementByClass("thesebits").style.visibility = "hidden";
 
Ying Yang
Back to Top
ub3rl337ch3ch View Drop Down
Senior Member
Senior Member
Avatar

Joined: 16 February 2005
Location: Australia
Status: Offline
Points: 341 		Direct Link To This Post Posted: 30 May 2005 at 8:48pm
*grumbles something about being shown up*
 
Tongue
Back to Top
ctoz View Drop Down
Newbie
Newbie


Joined: 26 May 2005
Location: Australia
Status: Offline
Points: 7 		Direct Link To This Post Posted: 30 May 2005 at 9:13pm
u and me both
Embarrassed
Back to Top
dfrancis View Drop Down
Senior Member
Senior Member


Joined: 16 March 2005
Location: United States
Status: Offline
Points: 442 		Direct Link To This Post Posted: 31 May 2005 at 10:17am
Originally posted by ub3rl337ch3ch ub3rl337ch3ch wrote:

*grumbles something about being shown up*
 
Tongue
 
You guys ROCK! Clap
 
(That's a good thing!)
Back to Top
 Post Reply Post Reply Page  12>

Forum Jump Forum Permissions View Drop Down

Forum Software by Web Wiz Forums® version 12.08
Copyright ©2001-2026 Web Wiz Ltd.

Become a Fan on Facebook Follow us on X Connect with us on LinkedIn Web Wiz Blogs
About Web Wiz | Contact Web Wiz | Terms & Conditions | Cookies | Privacy Notice

Web Wiz is the trading name of Web Wiz Ltd. Company registration No. 05977755. Registered in England and Wales.
Registered office: Web Wiz Ltd, Unit 18, The Glenmore Centre, Fancy Road, Poole, Dorset, BH12 4FB, UK.

Prices exclude VAT at 20% unless otherwise stated. VAT No. GB988999105 - $, € prices shown as a guideline only.

Copyright ©2001-2026 Web Wiz Ltd. All rights reserved.