Witam serdecznie zaczynam pisać malutki skrypt do pokazywania zdjęć na warstwie coś jak lightbox. Galeria którą posiadam jest oparta o Mysql wyświetlam dane z bazy i nie wiem jak zrobić aby zdjęcie w ukrytej warstwie pokazywało się według danego id w bazie.

Aktualnie to pokazuje bądź chowa divy:

[HTML] pobierz, plaintext 
function pokaz()
{
document.getElementById("layer_bg").style.visibility = "visible";
document.getElementById("layer").style.visibility = "visible";
document.getElementById("image").style.visibility = "visible";
}
function ukryj()
{
document.getElementById("layer_bg").style.visibility = "hidden";
document.getElementById("layer").style.visibility = "hidden";
document.getElementById("image").style.visibility = "hidden";
}
[HTML] pobierz, plaintext 

Co musiałbym wykonać aby w tym divie pokazywało mi się zdjęcie po nr. id z bazy czyli w zależności na jakie foto kliknę skrypt będzie wiedział że ma je wyświetlić bo teraz niestety mi się nie udaje takiego efektu uzyskać mam stworzone te divy w pętli while i tam mam tag <img ... /> a w nim podany $dane[src_d] lecz to jak pisałem nie to co chciałbym uzyskać więc piszę na forum w uzyskaniu pomocy

Dawaj tym zdjeciom.


a w js odwołasz się do nich
I robisz sobie z tym co chcesz

[HTML] pobierz, plaintext 
<img src="dsfgsdfg" />
[HTML] pobierz, plaintext 

Rozumiem że to jest src tego obrazka w który klikam aby wywołać akcje

[HTML] pobierz, plaintext 
<img id="img_1" alt="" />
[HTML] pobierz, plaintext 

A tutaj nadaje $dane[src_d] i jego $dane[id] tak ;>

Zgadza sie.

mam problem z tym szukałem po google jakby to zrobić ale nie bardzo mi się udaje:( pomógłby ktoś ciutek więcej
Pozdrawiam

Ja też szukałem na google ale sam nie wiem czego. A może byś tak pokazał co masz i wtedy sie wymyśli?

Znalazłem coś teraz w necie ale nie wiem za bardzo jak to przerobić aby uzyskać to co chcę poprosiłbym o pomoc

[HTML] pobierz, plaintext 
<script type="text/javascript">
<!-- <![CDATA[
var idt = 0;
 
function koniec() {
  var id = document.getElementById('duze');
  id.style.display = 'none';
}
 
function ukryj() {
  clearTimeout(idt);
  idt = setTimeout(koniec, 300)
}
 
function duza(img, plik, pw, ph) {
  clearTimeout(idt);
  var oleft = otop = 0;
  sz = parseInt(img.style.width);
  wy = parseInt(img.style.height);
  do {
    oleft += img.offsetLeft;
    otop += img.offsetTop;
  } while (img = img.offsetParent);
  var x = oleft + sz/2;
  var y = otop  + wy/2;
  var id = document.getElementById('duze');
  id.style.width = pw+'px';
  id.style.height = ph+'px';
  id.style.left = x-(parseInt(id.style.width)/2)+'px';
  id.style.top = y-(parseInt(id.style.height)/2)+'px';
  if (parseInt(id.style.left)<0) id.style.left = '0px';
  if (parseInt(id.style.top)<0) id.style.top = '0px';
  id.innerHTML = "<img src='"+plik+"' style='width:"+pw+"px; height:"+ph+"px;' />";
  id.style.display = 'block';
}
// ]]> -->
</script>
[HTML] pobierz, plaintext 

a wywołanie tak

[HTML] pobierz, plaintext 
<img src="small.jpg" style='width:80px; height:60px;' onmouseover="duza(this, 'big.jpg')" onmouseout="ukryj()" />
<div id="duze" style="display: none; position: absolute; z-index: 2;" onmouseover='clearTimeout(idt)' onmouseout="ukryj()"></div>
[HTML] pobierz, plaintext 

Ten kod działa tak ze powieksza centralnie do originalnego obrazka a jak zrobić aby to zmienić i aby pokazywało się to zdjęcie poprostu na nowej warstwie po środku strony ;> ustawienie nie jest ważne bo to typowo proste ale jak zrobić aby na nowej warstwie się ukazał bo tutaj skrypt powiększa zdjęcie typowo nie znam js i dlatego chciałbym poprosić o pomoc.

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


Pomoże ktoś ? bardzo proszę