Veliki problem sa div-ovima

Evo o čemu je reč:
http://preparatiodaloe.rs/

Dakle, kada se klikne na neki preparat, otvara se div sa desne strane, kada kliknete na sledeći preparat, otvara se div preko prethodnog diva.
I to funkcioniše sve dok ne poželim da otvorim preparat koji je postavljen prepreparata koji sam otvorio.
To se dogadja zbog toga što su divovi tako napravljeni da idu jedan preko drugog uz pomož z-index CSSa.

Dobro, dakle, pitanje je: kako da rešim taj problem ? Potrebna mi je neka druga struktura koja će otvarati nov "prozor" uvek preko postojećeg prozora.
Molim za pomoć, mnogo mi je bitno i mnogo bih vam bio zahvalan na nekoj ideji!

Hvala

jQuery nezamenljiv za ovakve stvari... :)

dobro, ali to nije odgovor. . .
kako, šta ?
znam da je jQuery odličan . . ali.... :/

znači bukvalno se radi o nekoj skripti koja radi sledeće:
on click, hide all divs except this.

ali . . izgleda da je to za mene previše složeno, spetljao sam se jaaako sa time sad . .

Gledam mail i reko ES mailer se zaglupeo salje mi sve zivo iz foruma Fotografija :)
Mozda je bolje da otvoris temu ili da je prebaci admin u JavaScript ili html/css, pre ces dobiti odgovor

Inace probaj da na onclick prvo zatvoris sve divove koji mogu da budu otvoreni ili koji su vec otvoreni (jquerijem jedna linija, jedan selektor) i onda otvori aktuelni div. Tako ces uvek imati samo jedan div desno aktivan i nece nijedan moci da ga prekrije

Potpis

http://norway.dakipro.com/

jaao.. tek sad vidim da sam je postavio u fotografiju . . o Bože -.-

jQuery ti je vrlo prost
bukvalno ces sa par lniija koda da resis to...

na primer

imas sadrzaje sa desne strane i zadaj im id da im bude "sadrz1", "sadrz2" itd.

recimo da pojavljivanje resavas sa

$('#sadrz1').show();

a skrivanje sa

$('#sadrz1').hide();



E sad, na primer, imas stavku u meniju koja ce da bude dugme


$('#dugme1').click(function() {
$('#sadrz1').show();
$('#sadrz2').hide();
$('#sadrz3').hide();
$('#sadrz4').hide();
$('#sadrz5').hide();
});





Naravno, to sve treba da pokrenes u startu, pa ces u zaglavlje da stavis


<script type="text/javascript">
$(document).ready(function() {

...pa sve ovo odozgo...

});

</script>



a potreban ti je i jQuery fajl, koji ces da skines sa sajta i isto pre svega u zaglavlju da stavis, na pr.

<script type="text/javascript" src="jquery.min.js"></script>






postoji i jednostavnija verzija svega ovoga, sa siblingsima i sl.... potrazi malo...
ja se ne bavim programiranjem, ali bez jQuery-a bi mi zivot bio mnogo tezi :)









EDIT:
E da... zaboravio sam da treba svim tim DIVovima da zadas display:hide; u CSS-u kao pocetnu vrednost.

šta da ti kažem osim da si CAR! :D
Sve sam uradio, sve radi i puno ti hvala !:D

Ovo je sav kod koji ti treba. Moraces da sredis malo html tako da ti div #preparat-description obuhvata sve one opise.
(Valjda treba da se izbaci div #p koji je prazan i ne sluzi nicemu, kao i da se izbaci jos jednom dodat div #preparat-description kod div-a #p6 .)
Id elementa unutar ovih glavnih div-ova vise nije bitan, mozes ih izbrisati.

Ako imas nekih problema, slobodno pitaj.

Da se nadovezem na onu drugu temu:
Kada sam video da si animaciju u JQ-u odradio preko show() i hide(), pretpostavio sam da znas JQ ali da se nisi setio. Kod je vise nego trivijalan.
Sada razumes sto ti nisam resio sve?
Ja licno preferiram put ucenja. Kada nesto ne znam vise volim da mi se objasni kako da uradim nego da mi se uradi. To sam pokusao da primenim i ovde. Rekoh ti kako da resis preko JS-a jer si se to pitao, i rekao sam ti da moze i preko JQ-a jer ga imas na stranici. Da te je zanimalo to takvo resenje, rekao bih ti kako. Mozda iz nekog razloga ti bas hoces da bude JS i ne zanima te drugo resenje bas kao sto te ne zanima misljenje o sajtu.

Edit: Zaboravio sam da kazem da sam sklonio <a> elemente unutar <li>. Preko CSS-a promeni kursor ako zelis. Ovo sam uradio da ne bi bilo skakanja na pocetak liste ako je scroll-ovana.