Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [css] div + ukrywanie obrazków
Forum PHP.pl > Forum > Po stronie przeglądarki > CSS
ziomalgd
Witam, mam mały problem. Po kolei przedstawie o co mi chodzi:
Mam formularz z polem typu SELECT. W nim mam 3 pola OPTION. Przykładowo:

Kod
<FORM ACTION="?" METHOD="POST">
<select onChange="xxxxxxxxxxxxxxx">
   <option VALUE="">aaa</OPTION>
   <option VALUE="">bbb</OPTION>
   <option VALUE="">cccc</OPTION>    
</SELECT>
</FORM>



Na stronie mam chce wyświetlać 5 obrazków. Mam ich nazwy zapisane w tablicach (php):
tablica1[];
tablica2[];
tablica3[];
W kazdej tablicy jest 5 nazw obrazków.

Tutaj moje pytanie:
Jak zrobić, żeby po przełączeniu SELECT (bez przeładowania strony) zmieniały mi się te obrazki (były szczytywane z tych tablic).
Czytając gdzie moge, wpadłem n pomysł, żeby stworzyć DIV'y , które zawierałyby obrazki z poszczególnych tablic, natomiast przelaczanie SELECTA powodowaloby ukrywanie 2 div'ów i pokazywanie jednego wybranego.
TYLKO PYTANKO jak to zrobić ? Czy to w ogole mozliwe ? Jestem laikiem jesli chodzi o CSS i JS. A moze jest lepsze wyjscie ?

BARDZO PROSZE O POMOC exclamation.gif!
revyag
Kod
<script type="text/javascript">

function show(val){
    switch(val[val.selectedIndex].value){
        case '1': var tab = tablica1;break;
        case '2': var tab = tablica2;break;
        case '3': var tab = tablica3;break;        
    }        
    document.getElementById("prev").innerHTML="";
    for(i=0;i<tab.length;i++){
        document.getElementById("prev").innerHTML+='<img src="'+tab[i]+'">';
    }
}</script>

  1. <select id="sel" onchange="show(this)">
  2. <option value="1">tablica 1</option>
  3. <option value="2">tablica 2</option>
  4. <option value="3">tablica 3</option>
  5. <div id="prev">
  6.  
  7. </div>
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.