Galeria zdjęć w JAVA SCRIPT

HTML to podstawy w dziedzinie tworzenia stron WWW, Style CSS warto opanować, bowiem za ich pomocą można dostosować odpowiednio wygląd swojej witryny WWW. Zagłębiamy się dalej i udostępniamy w tym forum możliwość zadawania pytań o JavaScript.
ODPOWIEDZ
teemka
Posty: 1
Rejestracja: ndz mar 30, 2008 9:33 pm

Galeria zdjęć w JAVA SCRIPT

Post autor: teemka »

Zmieniłam poniższą galerię na java scriptową. Taką znalazłam na http://www.damart.com.pl/index.php?y=10&z=107&x=, tylko że u mnie nie chce coś śmigać... proszę o pomoc, oto fragment kodu:

Kod: Zaznacz cały

<div id="okienko">											

<img  src="modelka/107/1.jpg" alt="modelka " id="okno" /><div style=" text-align:center;"><b>Agnieszka K</b> wzrost: 178  biust: 88 talia: 62 biodra: 88 
 </div>	
</div>	
<div  >
 
<table border="0" cellspacing="1" summary="" >
 <tbody>
   <tr><td><img  class="mini" src="modelka/107/1.jpg"  onmouseover="displayImage('modelka/107/1.jpg');" /></td> 

<td><img  class="mini" src="modelka/107/2.jpg"  onmouseover="displayImage('modelka/107/2.jpg');" /></td> 

<td><img  class="mini" src="modelka/107/3.jpg"  onmouseover="displayImage('modelka/107/3.jpg');" /></td> </tr></tbody></table></div>
-------------------------end--------------------------
Stary post:

Witam, potrzebuję pilnie galerii do strony modelek. Chciałam by po prostu po kliknięciu na miniaturkę OBOK lub u góry pojawiało się zdjęcie. Szukałam po sieci, ale żadne LightBox'y nie działają tak jak chcę. Jedynie Joomlik posiadał taką galerię, ale nie nie chcę instalować Joomli.
Stworzyłam nawet taką fajną galeryjkę w css'ie, która (jak do niedawna myślałam) jedyną wadę ma taką, że wyświetla zdjęcie po najechaniu na miniaturkę. Okazało się, że jednak to nie działa pod IE [wrrrr] Proszę o pomoc... Co mogę z tym zrobić? Pozdrawiam.
Podaję kod:

Kod: Zaznacz cały

<style type="text/css">
   #min {position: relative;}
  #min img.big  {display:none;}
 
  #min:hover img.big {display: block; position: absolute; bottom:90px; left:-25px;}

   #min img.big2  {display:none;}
 
  #min:hover img.big2 {display: block; position: absolute; bottom:110px; left: -80px;}
 
     #min img.big3  {display:none;}
 
  #min:hover img.big3 {display: block; position: absolute; bottom:90px; right: 0px;}


  </style>
...
<table align=right>
<tr><td><div id="min"><img src="1_min.jpg"><img src="1.jpg" class="big" alt=""> </div></td>
<td><div id="min"><img src="2_min.jpg"><img src="2.jpg" class="big2"  alt="" > </div></td>
<td><div id="min"><img src="3_min.jpg"><img src="3.jpg" class="big3"  alt="" > </div></td>

</tr>

</table>
ODPOWIEDZ