[JS][AJAX][PHP] galeria zdjęć Opcje

[wiciu010]

Witam,

Chciałbym stworzyć glaerię taką jak jest na stronie http://poltroter.pl/galeria.php
Czyli jak klikam po prawej miniaturki to po lewej wczytuje mi zdjęcie bez przeładowania strony. Jak coś takiego wykonać ? Podejrzewam że AJAX + PHP gdyż zdjecia są przechowywane w bazie mysql

[Fafu]

Moim zdaniem nie jest do tego potrzeby zaden ajax i php wystarczy prosty skrypt w js:

[HTML] pobierz, plaintext 
<script type="text/javascript">
  function zmien(adres) {
	document.getElementById('zdjecie').src = adres;
  }
</script>
  <img src="zdjecie.jpg" id="zdjecie">
  <a href="javascript:zmien('cos.jpg')"><img src="miniaturka.jpg"></a>
  <a href="javascript:zmien('cos2.jpg')"><img src="miniaturka2.jpg"></a>
[HTML] pobierz, plaintext 

Jeśli coś niejasne moge wytłumaczyć.

[wiciu010]

Moim zdaniem nie jest do tego potrzeby zaden ajax i php wystarczy prosty skrypt w js:

[HTML] pobierz, plaintext 
<script type="text/javascript">
  function zmien(adres) {
	document.getElementById('zdjecie').src = adres;
  }
</script>
  <img src="zdjecie.jpg" id="zdjecie">
  <a href="javascript:zmien('cos.jpg')"><img src="miniaturka.jpg"></a>
  <a href="javascript:zmien('cos2.jpg')"><img src="miniaturka2.jpg"></a>
[HTML] pobierz, plaintext 

Jeśli coś niejasne moge wytłumaczyć.

OK działa zdjęcia mi zmienia, ale ja muszę jeszcze pobrać odpowiednie opisy do zdjęć z bazy danych. Więc tutaj chyba sam JS nie wystarczy ?

[Fafu]

A po co?
Taki przykład, możesz go sobie rozbudować:

[HTML] pobierz, plaintext 
<script type="text/javascript">
function zmien(adres, tytul, opis) {
document.getElementById('zdjecie').src = adres;
document.getElementById('tytul').innerHTML = tytul;
document.getElementById('opis').innerHTML = opis;
}
</script>
<b id="tytul">tytul</b>
<i id="opis">opis</i>
<img src="zdjecie.jpg" id="zdjecie">
<a href="javascript:zmien('cos.jpg', 'tytul 1', 'opis cos 1')"><img src="miniaturka.jpg"></a>
<a href="javascript:zmien('cos2.jpg', 'tytul 2', 'opis cos 2')"><img src="miniaturka2.jpg"></a>
[HTML] pobierz, plaintext 

Ten post edytował Fafu 6.08.2009, 20:50:46

[wiciu010]

Zrobiłem coś takiego:

Kod

function zmienObrazek (adres, tytul, autor, miejsce, wojewodztwo, region, polozenie, krajobraz, pora, opis, id)
{
    document.getElementById('zdjecie').src = adres;
    document.getElementById('tytul').innerHTML = tytul;
    document.getElementById('autor').innerHTML = autor;
    document.getElementById('miejsce').innerHTML = miejsce;
    document.getElementById('wojewodztwo').innerHTML = wojewodztwo;
    document.getElementById('region').innerHTML = region;
    document.getElementById('polozenie').innerHTML = polozenie;
    document.getElementById('krajobraz').innerHTML = krajobraz;
    document.getElementById('pora').innerHTML = pora;
    document.getElementById('opis').innerHTML = opis;
    
    $.ajax({
            url: "komentarze_galeria.php",
            //method: "GET",
            data: id,
            success: function(data){$("#komentarz").html(data)}
            });
}

i wywołuję w taki sposób:

Kod

<a href="java script:zmienObrazek('fotogaleria/394.JPG','lorem ipsum dolor','witek010','Łeba','kujawsko_1_pomorskie','Bydgoszcz i okolice','','','','max 300 znaków','394' )"><img src="fotogaleria/394.JPG" width="110px" height="70px" alt="ex8" /></a>

Ale coś nie działa, wszystkie opisy zmienia ale nie pojawiają się komentarze w <div id="komentarz"></div>

Do wyświetlania komentarzy chciałem skorzystać z jQuery

[Fafu]

[JAVASCRIPT] pobierz, plaintext 
$.ajax({
            url: "komentarze_galeria.php",
            method: "POST",
            data: 'id='+id,
            success: function(data){$("#komentarz").html(data);}
            });
[JAVASCRIPT] pobierz, plaintext 

chyba tak powinno być
No ale pokaż jeszcze ten twój skrypt "komentarze_galeria.php"

aha i taka mała uwaga: skoro masz jquery to czemu go nie używasz?

[JAVASCRIPT] pobierz, plaintext 
$("#zdjecie").attr('src', adres);
    $("#tytul").html(tytul);
[JAVASCRIPT] pobierz, plaintext 

Ten post edytował Fafu 8.08.2009, 00:22:37

[esiek]

Dzieki za pomysł bede o nim pamietał przy tworzeniu sobie galerii zdjec

a wogole to polecam lekture
http://funkcje.net/pod_kat/2/10.html

kilka fajnych scryptow ktore mozna przerobic i wykorzystać

a tu masz konkretny przykład fajnej galerii z wykorzystaniem ajaxu
http://www.internetmaker.pl/artykul/3308,1...ajax_-_php.html



Jak znasz troche PHP to zalapiesz AJAX i stworzysz cos fajnego