[jQuery] Lightbox i dynamiczne ładowanie przez .load() Opcje

[gordon34]

Witam serdecznie wszystkich,
mam mały problem z implementacją efektu wyswietlania zdjec przez efekty typu "lightbox".
Posiadam dynamicznie uzupelniane menu rozwijalne Parent -> Child1 Child2 Child3...
Kazdy Child laduje sie w odrebnym divie poprzez funkcje .load(). zeby bylo tego mało pobiera treść z dokladnie podanego diva czyli klikajac w Child1 zaladuje mi zawartosc kontenera "tresc" z pliku child1.html (taki przyklad) w kontener "załadunek".

w kazdym takim Child mam zdjęcia, które chciałbym podswietlac przez efekty typu Lightbox, Shadowbox itd... problem w tym, że ładując poszczegolne Child'y efekt lightbox nie widzi zdjęc ktore zaladowały sie razem z trescia. Zauwazylem ze w kodzie zrodlowym strony w przegladarce zostaje oryginalna tresc znajdująca sie w momencie "przed kliknieciem" Child. zatem nie dziwne ze nie widzis zdjec z Child'ow.

Czy ktos wie jak połączyć te efekty .load() z lighboxem aby działalo ?

Moze mało rozumnie to napisalem wiec jesli byłym jakis problem ze zrozumieniem to prosze napisac a ja postaram sie jeszcze bardziej to wyjasnic.
Pozdrawiam i dziekuje z gory za jakąkolwiek pomoc



edit
----------------------------------------------------------
Widać, że wsparcie jest pełne (IMG:style_emoticons/default/winksmiley.jpg)
Poczekam jeszcze ...

Ten post edytował gordon34 9.11.2010, 09:06:55

[erix]

Widać, że wsparcie jest pełne
Poczekam jeszcze ...

Jakie pytanie, taka odpowiedź - zero kodu, tylko opis, programowanie, to nie interpretacja wierszy, że możesz coś sobie spomiędzy nich wyciągnąć.

A jeśli chodzi o problem, to jeśli dobrze rozumiem, musisz dla zmienionej zawartości ponownie zainicjować lightboksa.

[gordon34]

Nie wiem po co tutaj ma być kod, gdyz nie mam zadnego problemy z syntaxem i bledy mi nie wyskakują no ale skoro tak to nakresle sprawe bardziej.
Na wordpressie robie opcje ładowania w locie z menu. klikając w menu ajax pobiera konkretny div z linka w ktory klikamy. ładuje go w specjalny div na stronie na ktorej sie znajdujemy. W zaladowanej stronie sa zdjecia ktore nie obsluguje lightbox a chcialbym zeby to robil (IMG:style_emoticons/default/winksmiley.jpg)

ponizej funkcja ladowania zawartosci stron

[PHP] pobierz, plaintext 
jQuery(document).ready(function($) { 
    var $mainContent = $("#content"), 
        siteUrl = "http://" + top.location.host.toString(), 
        url = ''; 
 
	$(document).delegate("ul#menu a", "click", function() { 
		location.hash = this.pathname; 
		return false; 
	});
 
	$(window).bind('hashchange', function(){ 
		url = window.location.hash.substring(1); 
 
		if (!url) { 
			return; 
		}
 
		if (url == '') {
			url = window.location.pathname;
		}
 
		url = url + " .ajaxed"; 
 
		$mainContent.animate({opacity: "0.1"}).html('<p>Ładuje...</>').load(url, function() { 
			$mainContent.animate({opacity: "1"}); 
		}); 
	});
 
	$(window).trigger('hashchange'); 
});
[PHP] pobierz, plaintext 

w tym wypadku linki zawarte w ul#menu ładują zawarttość diva .ajaxed do diva "content".
funkcja opiera sie o jakis skrypt do manipulowania hashami w adresie url.

a nawiązując do podpowiedzi erix'a to w ktorym momencie mam inicjowac lighboxa? w pliku ktory laduje sie do diva ?

[erix]

a nawiązując do podpowiedzi erix'a to w ktorym momencie mam inicjowac lighboxa? w pliku ktory laduje sie do diva ?

Nie, zaraz po wstrzyknięciu przez jQuery zawartości w wykonaniu load.

[gordon34]

Kurcze, powiem szczerze ze jest to dla mnie troche skomplikowane. biorac pod uwage ze musialbym sam skonfigurowac sobie liightboxa pod wordpressem, bo jak wiadomo sa gotowe wtyczki ktore dzialaja na wszystkie obrazki (oprocz tego ktory jest poruszany w problemie), to nie wiem jaki kod mialbym wstawic tam zaraz po .load()

masz moze jakies dobrze wytlumaczalne rozwiazanie tego problemu? bylbym niezmiernie wdzieczny


wiem ze mialbym dodac do naglowkow wszystkie potrzebne metatagi tj. js i css
a potem zaraz po opcji .load

[PHP] pobierz, plaintext 
$mainContent.animate({opacity: "0.1"}).html('<p>Ładuje...</>').load(url, function() { 
[PHP] pobierz, plaintext 

wrzucic cala formulke odpowiadajaca za lightboxa ?

[wookieb]

Tzn w funkcji która podałeś jako drugi argument do .load

Poza tym jakiego lightboxa używasz. Do Prototype czy Jquery?

[gordon34]

hmmmmm nie wiem do konca ktorego. jesli chodzi o gotowe wtyczki do wordpressa to staram sie wybierac te do jquery bo wiem ze reszta wtyczek korzysta z tego i nie chce zeby byly konfilkty.
a jesli chodzi o reczne podpinanie lightboxa to korzystam z tego tutoriala
ciezka sprawa. szukam i czytam wszystko co sie da w tej sprawie

poza tym sprobowalem dodac taki oto kod

[PHP] pobierz, plaintext 
$mainContent.animate({opacity: "0.1"}).html('<p>Ładuje...</>').load(url, function() { 
 
			$('a[rel*=lightbox]').lightBox();
 
			$mainContent.animate({opacity: "1"});
 
		}); 
[PHP] pobierz, plaintext 

ale nawet przy zaladowaniu sztywno strony przez dokladny adres jej (nie przez funkcje .load() ) nie znajduje mi tego linka z lightboxem

probowałem tez calej funkcji

[PHP] pobierz, plaintext 
$mainContent.animate({opacity: "0.1"}).html('<p>Ładuje...</>').load(url, function() { 
 
			$(document).ready(function($) {
$('a[rel*=lightbox]').lightBox()
});
 
			$mainContent.animate({opacity: "1"});
 
		}); 
[PHP] pobierz, plaintext 

Ten post edytował gordon34 10.11.2010, 12:26:03