Re: How to implement a mask of visibility/invisibility of a set of<div> elements?

[Num GG]

Wow... this post is pretty unreadable. Ok, i'll try to make it
simpler:

I've got this first page:
-----------------------------------------------------------
<div id=1>some text here</div>
<div id=2 style="display: none;"some text here</div>
<div id=3another text here </div>
<div id=4 style="display: none;">text here:
<div id=4.1>one comment </div>
<div id=4.2>another comment </div>
</div>
<div id=5 style="display: none"some text </div>
-----------------------------------------------------------
divs 1 and 3 are visible
divs 2, 4 and 5 are hidden (and 4.1, 4.2 too as they're 4's children).
This page is the reference in terms of visibility of divs.

Now, let's say I have another page, like this one:
-----------------------------------------------------------
<div id=1>some text here</div>
<div id=2some text here</div>
<div id=3another text here </div>
<div id=4>text here:
<div id=4.1>one comment </div>
<div id=4.2>another comment </div>
<div id=4.3>yet another comment </div>
</div>
<div id=5some text </div>
<div id=6a new div here with some text!!! </div>
-----------------------------------------------------------
This page is somehow the same but not really because:
- All divs are visible
- the div 4.3 have been added
- the div 6 is new too

OK?
Now the question is:
For this second page, considering my reference page, how could I
programmaticall y:
-let divs 1 and 3 visible
-hide divs 2, 4, 5 ( and all children divs of 4)
-hide div 6 too.

Thanks for all kind of suggestions.

Num,

[The Natural Philosopher]

Num GG wrote:

Wow... this post is pretty unreadable. Ok, i'll try to make it
simpler:

I've got this first page:
-----------------------------------------------------------
<div id=1>some text here</div>
<div id=2 style="display: none;"some text here</div>
<div id=3another text here </div>
<div id=4 style="display: none;">text here:
<div id=4.1>one comment </div>
<div id=4.2>another comment </div>
</div>
<div id=5 style="display: none"some text </div>
-----------------------------------------------------------
divs 1 and 3 are visible
divs 2, 4 and 5 are hidden (and 4.1, 4.2 too as they're 4's children).
This page is the reference in terms of visibility of divs.

Now, let's say I have another page, like this one:
-----------------------------------------------------------
<div id=1>some text here</div>
<div id=2some text here</div>
<div id=3another text here </div>
<div id=4>text here:
<div id=4.1>one comment </div>
<div id=4.2>another comment </div>
<div id=4.3>yet another comment </div>
</div>
<div id=5some text </div>
<div id=6a new div here with some text!!! </div>
-----------------------------------------------------------
This page is somehow the same but not really because:
- All divs are visible
- the div 4.3 have been added
- the div 6 is new too

OK?
Now the question is:
For this second page, considering my reference page, how could I
programmaticall y:
-let divs 1 and 3 visible
-hide divs 2, 4, 5 ( and all children divs of 4)
-hide div 6 too.

Thanks for all kind of suggestions.

Num,

1/. Give all divs an id="something" statement so you can
'programmatical ly' FIND them .

2/. Write a program that on some event, finds them and sets their
style.display property between 'inline' and 'none'.

3/. If you want stuff to overlay stuff, look at the Z-index style attribute.

4/. if its just a question of switching a page put it in one div
container and switch that.