imgbox + history jquery = nie działa Opcje

[Derwu]

Witam ponownie,

kolejny problem.

Używam pluginy do jQuery:

1. history http://www.mikage.to/jquery/jquery_history_xhtml.html#aao
2. imgbox http://jqueryglobe.com/article/imgbox

Gdy użyję tylko imgbox'a działa bez zarzutów, gdy użyję tylko history też działa ok, natomiast jeżeli probuję wykorzystać oba pluginy, nie działa ani imgbox, ani history.

Wygląda to wszystko tak i działać nie chce w takiej konfiguracji

CODE

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
<script type="text/javascript" src="imgbox/jquery.imgbox.pack.js"></script>
<link rel="stylesheet" href="imgbox/imgbox.css" />


<script type="text/javascript">
$(document).ready(function() {
$("a.galeria").imgbox();

});
</script>




<script type="text/javascript" src="js/jquery.history.js"></script>
<script type="text/javascript">
// PageLoad function
// This function is called when:
// 1. after calling $.historyInit();
// 2. after calling $.historyLoad();
// 3. after pushing "Go Back" button of a browser
function pageload(hash) {
if (!isNaN(hash)){
var url = "get.php?id="+ escape(hash) + "&language=<?php echo $language?>";
}
else {
if(hash!='szukaj'){
var url = "get.php?show_realizacje="+ escape(hash).replace('realizacja', '') + "&language=<?php echo $language?>";
}
else if (hash=='szukaj') {
var url = "get.php?search="+ document.forms[0].search.value +"&language=<?php echo $language?>";
}
}
if(hash) {
$("#tresc").load(url);
}
}

$(document).ready(function(){
// Initialize history plugin.
// The callback is called at once by present location.hash.
$.historyInit(pageload, "get.php?id=33&language=<?php echo $language?>");

// set onlick event for buttons
$("a[rel='menu']").click(function(){
//
var hash = this.href;
hash = hash.replace(/^.*#/, '');
// moves to a new page.
// pageload is called at once.
// hash don't contain "#", "?"
$.historyLoad(hash);
return false;
});
});
</script>

Proszę o pomoc.

[vokiel]

[HTML] pobierz, plaintext 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.history.js"></script>
<script type="text/javascript" src="imgbox/jquery.imgbox.pack.js"></script>
<link rel="stylesheet" href="imgbox/imgbox.css" />
[HTML] pobierz, plaintext 

[JAVASCRIPT] pobierz, plaintext 
<script type="text/javascript">
// PageLoad function
// This function is called when:
// 1. after calling $.historyInit();
// 2. after calling $.historyLoad();
// 3. after pushing "Go Back" button of a browser
function pageload(hash) {
    if (!isNaN(hash)){
        var url = "get.php?id="+ escape(hash) + "&language=<?php echo $language?>";
    } else {
        if(hash!='szukaj'){
            var url = "get.php?show_realizacje="+ escape(hash).replace('realizacja', '') + "&language=<?php echo $language?>";
        } else if (hash=='szukaj') {
            var url = "get.php?search="+ document.forms[0].search.value +"&language=<?php echo $language?>";
        }
    }
    if(url) {
        $("#tresc").load(url);
    }
}
 
$(document).ready(function() {
    // Initialize history plugin.
    // The callback is called at once by present location.hash. 
    $.historyInit(pageload, "get.php?id=33&language=<?php echo $language?>");
    // set onlick event for buttons
    $("a[rel='menu']").click(function(){
        var hash = this.href;
        hash = hash.replace(/^.*#/, '');
        // moves to a new page. 
        // pageload is called at once. 
        // hash don't contain "#", "?"
        $.historyLoad(hash);
        return false;
    });
 
    $("a.galeria").imgbox();
});
</script>
[JAVASCRIPT] pobierz, plaintext 

No i teraz firebug i debuguj (IMG:style_emoticons/default/winksmiley.jpg)

[Derwu]

Nie wiem gdzie umieścić ten JS teraz, do tej pory umieszczałem w index.php i konsola nie wyrzucała żadnych błędów, ale dla testów, wrzuciłem to wszystko co wyżej napisałeś do index.php i do get.php (pobiera mi tresc strony z bazy danych) i pokazuje błędy takie jak poniżej. No tak ale teraz to wszystko ładuje się dwa razu, najpierw z index.php potem z get.php. Gdzie ma być ten JS w końcu? Wydaje mi się, że w index.php, no ale wtedy nie działa imgbox...

Skopiowane z konsoli firebuga

CODE

jQuery.historyCallback is not a function
anonymous()2 (wiersz 116)
[Break on this error] <dt><span class="kwadrat"></span>\n#35 (wiersz 117)
Nieznana pseudoklasa lub pseudoelement "eq".

Ten post edytował Derwu 3.12.2009, 13:14:59

[vokiel]

get.php powinien pobierać tylko content, który wpisujesz do środka div'a o id="tresc", nie powinien przesyłać nagłówka:

[HTML] pobierz, plaintext 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
	<head>
 
	</head>
	<body>
[HTML] pobierz, plaintext 

Problemem może być też to, że content jest ładowany dynamicznie, zatem przypisanie do imgbox nie zadziała. Skorzystaj z pluginu livequery

[Derwu]

Dzięki za zwrócenie uwagi co do nagłówków, get.php wypisuje teraz tylko treść.

Użyłem pluginu livequery w taki sposób jak poniżej, ale nadal nie działa, gdy włączony jest plugin history

[HTML] pobierz, plaintext 
		<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
		<script src="js/jquery.livequery.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript" src="js/jquery.history.js"></script>
		<script type="text/javascript" src="imgbox/jquery.imgbox.pack.js"></script>
		<link rel="stylesheet" href="imgbox/imgbox.css" />
[HTML] pobierz, plaintext 

[JAVASCRIPT] pobierz, plaintext 
 
		<script type="text/javascript">
		// PageLoad function
		// This function is called when:
		// 1. after calling $.historyInit();
		// 2. after calling $.historyLoad();
		// 3. after pushing "Go Back" button of a browser
		function pageload(hash) {
				if (!isNaN(hash)){
						var url = "get.php?id="+ escape(hash) + "&language=<?php echo $language?>";
				} else {
						if(hash!='szukaj'){
								var url = "get.php?show_realizacje="+ escape(hash).replace('realizacja', '') + "&language=<?php echo $language?>";
						} else if (hash=='szukaj') {
								var url = "get.php?search="+ document.forms[0].search.value +"&language=<?php echo $language?>";
						}
				}
				if(url) {
						$("#tresc").load(url);
				}
		}
 
		$(document).ready(function() {
				// Initialize history plugin.
				// The callback is called at once by present location.hash. 
				$.historyInit(pageload, "get.php?id=33&language=<?php echo $language?>");
				// set onlick event for buttons
				$("a[rel='menu']").click(function(){
						var hash = this.href;
						hash = hash.replace(/^.*#/, '');
						// moves to a new page. 
						// pageload is called at once. 
						// hash don't contain "#", "?"
						$.historyLoad(hash);
						return false;
				});
 
				$("a.galeria").imgbox();
				$('a.galeria') 
				.livequery('click', function(event) { 
						imgbox(); 
				});
		});
 
		</script>
[JAVASCRIPT] pobierz, plaintext 

Ten post edytował Derwu 3.12.2009, 16:21:49

[vokiel]

Imgbox'a wywołuj tylko raz, masz go zainicjować, nie podpinać inicjowanie do każdego kliknięcia. Zamiast tego:

[JAVASCRIPT] pobierz, plaintext 
$("a.galeria").imgbox();
$('a.galeria') 
    .livequery('click', function(event) { 
	imgbox(); 
});
[JAVASCRIPT] pobierz, plaintext 

Daj któreś z tych (raczej drugie):

[JAVASCRIPT] pobierz, plaintext 
$('a.galeria').livequery(imgbox()); // tak pewnie nie zadziała
// ale tak powinno
$('a.galeria').livequery(function(){
    $(this).imgbox();
});
[JAVASCRIPT] pobierz, plaintext 

[Derwu]

vokiel stokrotne dzięki, teraz wszystko działa jak należy.