jquery-Problem

[bwoebi]

Ich habe hier ein Problem mit dem jquery und kann absolut nix mit der Fehlermeldung anfangen…

HTML:

Code: Alles auswählen

<progress progress_stop="1310054187" progress_start="1310052745" max="100" value="69"><div id="ha_zeit-1310052745">69%</div></progress>

wird nach erstem JS-Durchlauf zu:

Code: Alles auswählen

<progress progress_stop="1310054187" progress_start="1310052745" max="100" value="68.6546463245492"><div id="ha_zeit-1310052745"><img width="120" id="ha_zeit-1310052745_pbImage" title=" 50%" alt=" 0%" src="{T_THEME_PATH}/img/progressbar.gif" style="width: 120px; height: 12px; background-image: url("{T_THEME_PATH}/img/progressbg_orange.gif"); background-position: -60px 50%; padding: 0pt; margin: 0pt;"><span id="ha_zeit-1310052745_pbText"> 69%</span></div></progress>

JS:

Code: Alles auswählen

				$('progress').each(function() {
					$(this).find('div[id^=ha_zeit]').progressBar({
						boxImage:	'{T_THEME_PATH}/img/progressbar.gif',
						barImage:	{
							0	:		'{T_THEME_PATH}/img/progressbg_red.gif',
							30	:		'{T_THEME_PATH}/img/progressbg_orange.gif',
							70	:		'{T_THEME_PATH}/img/progressbg_green.gif'
						}
					});
				});
				setInterval(function(){
					$('progress').each(function(){
						$(this).val(((Math.round((new Date()).getTime() / 1000) - $(this).attr("progress_start")) / ($(this).attr("progress_stop") - $(this).attr("progress_start"))) * 100);
						val = $(this).val() * (-1.2);
						val2 = "px 50%";
						$(this).find('img[id$="pbImage"]').css("background-position",val + val2);
					});
				},500);

Die Value des Progress-Tags verändert sich wie gewünscht; aber warum bekomme ich bei dieser Zeile $(this).find('img[id$="pbImage"]').css("background-position",val + val2); eine Fehlermeldung à la

(c.value || "").replace is not a function
[Break On This Error] (function(a,b){function b$(a){return d... a==="string"?a:a+"px")}})})(window);
jquery-1.5.min.js (line 16)

Kann mir bitte einer erklären was ich falsch mache und wie es richtig wäre.

[Benu]

Die Value des Progress-Tags verändert sich wie gewünscht; aber warum bekomme ich bei dieser Zeile $(this).find('img[id$="pbImage"]').css("background-position",val + val2); eine Fehlermeldung à la

(c.value || "").replace is not a function
[Break On This Error] (function(a,b){function b$(a){return d... a==="string"?a:a+"px")}})})(window);
jquery-1.5.min.js (line 16)

Kann mir bitte einer erklären was ich falsch mache und wie es richtig wäre.

1. XML, (X)HTML, HTML 4/5 ?
3. Lösungsvorschlag:

Code: Alles auswählen

 $('img[id$="pbImage"]', this) 

Der zweite Parameter gibt immer den Kontext an, indem das Element gesucht wird.

[bwoebi]

1. XML, (X)HTML, HTML 4/5 ?

Wie meinst du? konform zu einer dieser Layouttyps?

wo ist Nummer 2?^^

Und der Lösungsvorschlag hat nichts geändert, Fehlermeldung ist dieselbe, aber thx für den Hinweis, jquery habe mehr als einen Parameter, wusste das noch nicht

[Benu]

1. XML, (X)HTML, HTML 4/5 ?

Wie meinst du? konform zu einer dieser Layouttyps?

wo ist Nummer 2?^^

Und der Lösungsvorschlag hat nichts geändert, Fehlermeldung ist dieselbe, aber thx für den Hinweis, jquery habe mehr als einen Parameter, wusste das noch nicht

Ja der DOCTYPE halt. Probier mal in (X)HTML.
Wie sieht dein Markup aus?

Edit:
Missbrauch mal nicht das lasche Typecasting von JS:
"" + val + val2 oder
val.toString() + val2

[bwoebi]

hat nichts geholfen

Ich verstehe das nimmer…


EDIT: funzt, war dieses Mal nur der blöde Cache^^ Thx

[Benu]

hat nichts geholfen

Ich verstehe das nimmer…


EDIT: funzt, war dieses Mal nur der blöde Cache^^ Thx

Typecasting wars, ne?

Übrigens war die Doctype Frage leicht peinlich. Progress gibts nur in HTML 5

[bwoebi]

Jop, und bzgl. Doctype, das hab ich mir auch schon gedacht, aber nicht gesagt^^

Ach ja, XHTML nervt... XHTML wird eh mit HTML5 wieder abgeschafft, und warum meint heutzutage jeder er müsse korrekte <br /> machen statt <br>; jeder Browser interpretiert es sowieso richtig…?^^

p.s.: Fallbacks sind praktisch

[Benu]

Sinn von XHTML wohl nicht verstanden.
XHTML wird nicht abgeschafft mit HTML 5. HTML 5 ist die Erweiterung zu HTML 4.1 nicht XHTML.
HTML Markups kann man nicht durch XML-Parser jagen. Deswegen XHTML.
HTML ist nicht erweiterbar. Da Semantik aber nun nicht formalisiert werden kann, ist das aber für Auszeichnungssprachen wichtig. Könnte noch zig ander Gründe aufzählen aber darum gehts hier nicht.

Wichtiger ist, dass du nur ein Bruchteil von jQuerys Power nutzt. Es gibt sowas wie animate() etc. Und naja CSS vor JS Animationen halt^^

[bwoebi]

Habe gerade nochmals beim w3c nachgelesen: html5 ist tatsächlich HTML4.1-Erweiterung und appliziert nur einige XHTML-Standarts…
XHTML(2) wurde aber aufgegeben.

Das Problem ist halt, dass wenn man CSS-Animationen macht, die meisten etwas älteren Browser nicht fähig dazu sind…

EDIT: http://www.w3.org/TR/html5/the-xhtml-sy ... tml-syntax XHTML-Syntax ist jetzt nur noch Unterpunkt von HTML5 wenn ich das richtig verstanden habe