Forum PHP.pl > obrazy, i ich opisy

Pomoc - Szukaj - Użytkownicy - Kalendarz

Forum PHP.pl > Forum > Po stronie przeglądarki

right6

18.03.2006, 16:40:59

chce zrobic cos takiego:

wyswietlam skryptowo w php iles tam gifow 20x20px, sa one rozlozone obok siebie, w kilkunastu liniach.
I zeby po kliknieciu na jakas ikonke, pojawila sie ona, bez przeladowania strony, na samej gorze strony, wraz z jej opisem pod spodem (opis pobrany z bazy), AJAX'a bym w to platac nie chcial.

mysle, zeby pobrac wszystkie te ikony, razem z opisami, tylko opis jakos wpakowac tak aby byl ukryty ... ? i potem to JS "odkryc" i wyswietlic na samej gorze.

sinq

18.03.2006, 17:52:20

no to powiedzmy ze mamy juz te gify wyswietlone wraz z opisami (id możesz sobie generować za pomocą php):

[HTML] pobierz, plaintext 
<img src="sciezka_do_gifa" onclick="pokaz('opis1');" />
<div class="opis" id="opis1" style="display: none;">Opis dla obrazka nr 1</div>
 
<img src="sciezka_do_gifa" onclick="pokaz('opis2');" />
<div class="opis" id="opis2" style="display: none;">Opis dla obrazka nr 2</div>
 
<img src="sciezka_do_gifa" onclick="pokaz('opis3');" />
<div class="opis" id="opis3" style="display: none;">Opis dla obrazka nr 3</div>
[HTML] pobierz, plaintext

teraz js:

Kod

if(!document.getElementById)
    document.getElementById = function(id) {
       return document.all[id];
    }

function pokaz(opis) {
   if (document.getElementById(opis).style.display == '') {
       document.getElementById(opis).style.display = 'none'
   }
   else
   {
       document.getElementById(opis).style.display = '';
       document.getElementById(opis).style.position = 'absolute';
       document.getElementById(opis).style.left = '350px';
       document.getElementById(opis).style.top = '300px';
   }
}

no i css (tutaj zmienimy tylko wygląd każdego z opisów za pomocą class):

Kod

.opis {
   background: #CECECE;
   border: 1px solid #ABABAB;
   filter:alpha(opacity=70);
   -moz-opacity:.70;
   opacity:.70;
}

z przezroczystością żeby ładnie wyglądało

wygląd można sobie dowolnie zmodyfikować w css i pare innych bajerów można też dodać

mam nadzieje że pomogłem

right6

18.03.2006, 18:21:17

nawet, by bylo

tylko pod ie ... lipa ...

sinq

18.03.2006, 18:25:14

no nie wiem przed chwilą sprawdziłem i działa w każdej przeglądarce

zamiast onclick możesz zrobic onmouseout i onmouseover zeby sie pokazywal kiedy najedziesz na link a znikal kiedy jestes poza nim (do tego jedna funkcja w js)

right6

18.03.2006, 18:43:52

no niby dziala ... tylko domyslnie blokuje js i czeka na akceptacje ... po akceptacji dziala, owszem

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.