Can I dynamically set the Z-index value?

[waqqas1]

You can see this website:

http://www.gravitation.com/

When Someone click on two button sin center it loads the side pages.

I want to add more pages. I know very little about JavaScript. But I learn this one and able to add more pages. But when clicking on other pages it will take ne page but under already excisting page.

I want to add functionality so that when for example click on a link, one page slide to the left. Then I will click another page slide on th left.

So here it either slides down above of the page or first that previous page slides back.

Can somebody help me????????


Kind Regards!

[Nile]

I would have an array called displayed with two variables, each with a key 'right' and 'left'

var displayed = [];
displayed['right'] = ""; //id of the current displayed side on the right or nothing, if none
displayed['left'] = ""; // -------------------------------------------- left ---------------------

When the user clicks a link that opens something on the right side, the javascript would check the displayed['right'] for emptiness or an ID of the element that is there. I would then get that element, if any, and tell it to slide back into the unknown depths of side of your browser. After that, the link clicked would display the corresponding page.

if(displayed[$(this).data('side')].length != 0){
  $(displayed[$(this).data('side']).toggle(500);
}
$($(this).attr('href')+'-page').toggle(500);

[waqqas1]

Thanks Nile!

But I am very new! So can you tell me further what I can do?

I will be very very thankful to you!

I am also attaching the files. I f you can plz get some time to change it. and then send the files back to me. I will be really thankful to you.

You can download the files from here: http://cc.waqasahmad.info/Idea.zip

When someone click on this:

<li>
<a href="#works">
<div id="works">
<span class="smalltype">the</span> Portfolio</div>
</a>
</li>

The it will incement the z-index of "works-page" div.


<div id="works-page" class="page">
<div class="in">
<div class="inner">
<div class="portfolioTitle"><h2 class="portfolio">Portfolio</h2></div>
</div>
</div>
</div>

-------------------------------

Basically I am just showing you one button but I want many buttons for the sam ething each time the button get previous value and increment it and assign it to its respective div.


I am also attaching the files which I am using plz can you see it and make required changes.

You can download the files from here:

http://cc.waqasahmad.info/Idea.zip

You can click on two button in center "Portfolio" and "Waqas Ahmed" several times. And you can then see that waqas ahmed section is always open under Portfolio section.

I want one of the two things if possible.

1. For Example when I click on Portfolio. It opens the section. Then if I click on Waqas Ahmed then it slide back portfolio and open Waqas Ahmed.

2. Ecah time when click on for example Portfolio it increment z-index and assign it to portfolio section. When click on Waqas Ahmed it do the same and so on. Bascially to always show the clicked section above.


I will be very thankful to you!

Will looking forward for reply!

Kind Regards!