Beiträge von Sempervivum

"Es produziert das selbe Ergebnis."
Das verstehe ich nicht, bei mir hat es mit dem Titel, der unter dem Bild angezeigt wird, funktioniert. Und ich hatte nichts geändert, außer der Zeile, die ich gepostet habe. Hast Du die XML-Datei auch hochgeladen? Außerdem funktioniert es nur, wenn die Dateien auf einem Webserver liegen. Wenn Du es lokal testet, ist das u. U. nicht der Fall.

"Wie nutze ich den Debugger?"
Der Debugger ist browserspezifisch. Versuche, für deinen Lieblingsbrowser eine Anleitung zu finden.

Das Problem liegt hier:

var titel = antwort.getElementsByTagName("bildtitel")[x];

Damit ermittelst Du das HTML-Element, Du brauchst jedoch den inneren Text:

var titel = antwort.getElementsByTagName("bildtitel")[x].innerHTML;

(Bei den anderen Parametern analog.)
Wenn Du dich weiter mit Javascript befassen willst, solltest Du dich mit dem Debugger deines Browsers vertraut machen, damit findet mal solche Fehler relativ leicht.

Dann poste doch auch mal die XML-Datei, damit man es selber testen kann. Wenige Einträge reichen aus.

Die eigentlichen Fehler liegen hier:

document.getElementById("vorschau").src = "bilder/1.jpg";

Du musst die Bildnummer einfügen:

document.getElementById("vorschau").src = "bilder/" + bildnummer + ".jpg";

und hier:

onclick="var bildnummer = 4; function thumb();">

"function" benötigst Du, um eine Funktion zu defieren, wenn du sie aufrufen willst, ist es fehl am Platze.

Davon abgesehen geht es auch um einiges einfacher:
Wenn Du den Parameter bildnummer definierst, solltest du ihn auch verwenden und die Variable weglassen:

<script type="text/javascript">
	function thumb(bildnummer) {
    	document.getElementById("vorschau").src = "bilder/" + bildnummer + ".jpg";
    	document.getElementById("bildtitel").innerHTML = "Dies ist das " + bildnummer + ". Bild ";
    	return false;
	}




</script>

Dann kannst die Funktion gleich mit der richtigen Bildnummer aufrufen:

<img src="bilder/thumbnails/1-thumb.jpg" onclick="thumb(1);" width="320" height="240" alt="Bild1" title="Bild1">

Und die a-href-Tags sind IMO überflüssig:

<div id="thumbnail">
	<img src="bilder/thumbnails/1-thumb.jpg" onclick="thumb(1);" width="320" height="240" alt="Bild1" title="Bild1">
	<img src="bilder/thumbnails/2-thumb.jpg" onclick="thumb(2);" width="320" height="240" alt="Bild1" title="Bild1">
	<img src="bilder/thumbnails/3-thumb.jpg" onclick="thumb(3);" width="320" height="240" alt="Bild1" title="Bild1">
	<img src="bilder/thumbnails/4-thumb.jpg" onclick="thumb(4);" width="320" height="240" alt="Bild1" title="Bild1">
</div>

Du könntest HTML5-video verwenden und warten, bis bei allen Videos das canplaythrough-Event eingetreten ist und sie dann alle starten.
PS: canplaythrough scheint hiernach nicht verwendbar zu sein:
http://www.sitepoint.com/essential-audi…ents-for-html5/
Unter diesem Link wird aber auch beschrieben, wie man es mit progress lösen kann.

Hier hast Du einen Syntaxfehler:

height; 240px;

Du musst das float:left; bei den Thumbnails heraus nehmen und ein white-space: nowrap; bei dem umgebenden div (#thumbnail) hinzufügen.

Wenn ich das richtig sehe, brauchst Du mit der Verkettung durch elseif nur weiterzumachen:

if(empty(trim($_POST['name']))) {




echo " Das Feld des Namen ist leer. ";




}




elseif(strlen($_POST['name']) < 3) {




echo " Der Name darf nicht kürzer als 3 Zeichen sein.";




}




elseif(empty(trim($_POST['new-name']))) {




echo " Das Feld des New-Name ist leer. ";




}




elseif(strlen($_POST['new-name']) < 3) {




echo " Der New-Name darf nicht kürzer als 3 Zeichen sein.";




}

Ich habe früher Scriptly benutzt und bin, weil es nicht mehr weiter entwickelt wird, nach längerer Suche auf MS Webmatrix umgestiegen.
Was mir gefällt:

• Syntax-Highlightung und Code-Vervollständigung
• Zeigt Syntax- und Validierungsfehler bei HTML, JS und PHP an
• Webserver integriert
• kostenlos

Was mir nicht gefällt, aber nicht schwer wiegt:

• Braucht etwas lange zum Starten
• Formatierung für JS funktioniert nicht richtig
• Kein PHP-Debugger

PHP-Designer 8 hört sich auch interessant an, ist nicht teuer und hat eine PHP-Debugger.

OMG, ich hatte das $ vergessen, so wäre es richtig:

$("#ele1id").css({left: ele1left + "px", top: el1top + "px"});

So wie Du es gemacht hast, ist es aber genau so gut. Nur dass man bei jQuery mehrere Attribute mit einem Aufruf ändern kann.

Das macht man i. allg. so (ich gehe mal davon aus, dass Du weißt, wie Du die Positionen berechnen kannst):

$(document).ready(function() {
	var wiwi = $(window).width();
	// hier die Positionen der Elemente berechnen
	var ele1left =
	var ele1top =
	("#ele1id").css({left: ele1left + "px", top: el1top + "px"});
	("#ele2id").css({left: ele2left + "px", top: el2top + "px"});
	// usw.
});

und den Elementen die entspr. ID geben:

<img id="ele1id" src=" ... ">
<img id="ele2id" src=" ... ">

Bei dem zweiten schließenden <div fehlt die schließende Klammer.

Ich habe mehrere DE-Mail-Konten und bin sehr ernüchtert, weil offenbar die breite Akzeptanz fehlt. In meiner Kommunikation beim Onlineshopping etc. ist es mir erst einmal passiert, dass ein Partner eine Korrespondenz per DE-Mail angeboten hat. Im Impressum und auf Briefköpfen findet man fast nie eine DE-Mail-Adresse.

Dieses Skript müsste dein Problem lösen:

$(document).ready(function () { var positions = [];
                $("#nav a").each(function () {
                    var anchr = $(this).attr("href");
                    var entry = { anchor: anchr, pos: $(anchr).offset().top };
                    positions.push(entry);
                });
                function highlightnav() {
                    var currentPos = $(window).scrollTop();
                    var idx = 0, anchr;
                    for (var i = 0; i < positions.length; i++) {
                        if (positions[i].pos < currentPos) idx = i;
                    }
                    anchr = positions[idx].anchor;
                    $("#nav a").each(function () {
                        if ($(this).attr("href") == anchr) {
                            $(this).addClass("current");
                        } else {
                            $(this).removeClass("current");
                        };
                    });
                }
                $(window).on("scroll", highlightnav)                             });

Es setzt die Klasse "current" bei dem betr. a-Tag. Daraus kannst Du dann das Hervorheben ableiten.

Versuch mal, das span absolut zu positionieren:

.tooltip { position:relative; z-index:20; }.tooltip span { display:none; position:absolute; left:0px; top:10px;}.tooltip:hover {z-index:21;}.tooltip:hover span {	 display:block;}

Und wenn das nicht funktioniert, poste mal die URL deiner ganzen Seite. Ich überblicke nicht, was das area-Tag und das Bild, das damit zusammen hängt, für eine Auswirkung hat.

"Ich frage nur mal nach, gibt es noch eine andere Möglichkeit oder ist das die gebräuchliche Methode?
Es sind hier javascripte einzubinden und von javascript habe ich noch keine ahnung.
da bin ich etwas zurückhaltend."

Ja, Lightbox ist eine gebräuchliche Methode und ja, es geht auch anders, indem man es selbst in Javascript programmiert, wie es hier schon beschrieben wurde.
Wenn Du von Javascript "noch keine Ahnung" hast, ist es mit Sicherheit einfacher, ein fertiges Lightbox-Plugin zu verwenden, als es selber zu programmieren. Bei diesen Plugins gibt es i. allg. eine Anleitung, die leicht umzusetzen sein sollte.

Freut mich, dass es funktioniert. Ich vermute, dass das Einbinden eines Frames sich wie ein Include verhält, so dass es Probleme gibt, wenn Vater und Kind in verschiedenen Verzeichnissen liegen.

Hallo Kurtus,
ich weiß nicht genau, wie es sich mit der Adressierung bei Frames verhält, aber ich würde probieren, mal den vollständigen Pfad zum Video anzugeben (http://www.mcv-moemlingen.de/startfiles/mcv-breit.mp4). Dann umgehst Du Probleme damit.

Danke für den Link, aber wie ich schon schrieb, gibt es genug Plugins. Meine Absicht war nur, Rantanplans Frage zu beantworten, warum sein Skript nicht mehrfach angewendet werden kann.

Zitat: " wieso geht denn die eine gallerie nur einmal pro seite?"
Der Grund ist, dass dieser Code globale Variablen verwendet und sich pauschal auf alle img-Tags bezieht, ein häufiges Problem bei älteren Skripts:

var images = document.getElementById("divId");
document.getElementsByTagName("img");

Eine schlechte Lösung wäre, die Variablen zu vervielfachen und ihnen und den IDs eindeutige Namen zu geben:

// 1st gallery
var images1 = document.getElementById("divId1");
// 2nd gallery
var images2 = document.getElementById("divId2");

Um die zugehörigen Bilder zu ermitteln, müsste man dann die Kind-Elemente der Container ermitteln. Wie gesagt, eine sehr schlechte Lösung.

Eine bessere Lösung besteht darin, alle Variablen in einer Funktion zu kapseln und alle HTML-Elemente in einem Container unterzubringen und dessen Selektor an die Funktion zu übergeben:

function mygallery(sel) {
	var bigimg = <img class="bigimg">;
	$(sel + " img").on("click", function() {
    	$(sel + ".bigimg").attr("src", $(this).attr("src"));
	});
	$(sel).prepend(bigimg);
}

Dann für die verschiedenen Galerien diese Funktion mit dem betr. Selektor aufrufen:

mygallery("#gallery1");
mygallery("#gallery2");

Ungetestet, ich wollte nur mal die ungefähre Vorgehensweise skizzieren.
BTW: Es gibt viele gute, fertige Galerie-Skripts, so dass es sich nicht lohnt, so etwas selber zu schreiben, es sei denn, man nimmt es als Übungsaufgabe, um Javascript/jQuery zu lernen. Z. B. dieses:
http://galleria.io/

Da fehlt das schließende </a>-