Javascript Bildname ermitteln und an href übergeben?

ThaHammer

Aktives Mitglied
Thread Starter
Dabei seit
01.06.2004
Beiträge
3.303
Reaktionspunkte
13
Code:
var Grafikdatei = window.document.target.name;
	Grafikdatei = "../amsterdam/images/" + Grafikdatei;

Das habe ich in meiner Javascriptfunktion stehen. Aufrufen wollte ich das ganze so:

Code:
<a href="Javascript:getname()" target="_blank" rel="lightbox[]">

Habe auf meiner Galerieseite einen Bilderwechsel eingebaut. Jetzt würde ich das noch gerne erweitern um die lightbox Funktion! Ich habe ein Bild, gebe ein Thumb aus, das man anklicken kann und damit ein mittelgrosses Bild wechselt. Nun soll durch Klick auf das mittelgrosse Bild, ein grosses Bild mithilfe von Lightbox aufgehen.

Nur wie kriege ich bei a href den Bildnamen richtig rein, damit Lightbox damit arbeiten kann? Wenn ich mit onClick arbeite und den Bildnamen nur ausgeben lasse funzt alles. Nur href macht da nicht so mit. Oder liegst an Lightbox selber?
 
Ich versteh zwar nicht genau, was Du meinst, aber ich rate mal:

HTML:
<a href="javascript:lightbox(getname())">Blablubb</a>

gruß
Lukas
 
Ne, geht so auch nicht. Denke es liegt an Lightbox, das im a Tag nur den href Inhalt abgreift. Denn bekommt Sie ja bei mir nicht! Mit einer Funktion oder Funktionsaufruf kann Lightbox da nichts anfangen! Dort muss der Name stehen, dann wird es gehen! Jetzt muss ich das nur irgendwie hinkriegen?
 
Ich glaube zu verstehen:

Also, mal ein kleiner Ablauf, wie ich das verstanden habe:

Du hast ein Kleines Bild.
Klickt man da drauf, wechselt das kleine Bild in eine gröere Vorschau.

Diese Vorschau ist mit einem Link versehen, der ein "richtiges" href-Attribut braucht...

Also, was mir jetzt in den Sinn kommt:

Ich nehme an, die gaz kleinen Bilder, das ist die Diashow, die Du gemacht hast. Sprich, da kann man sich durchklicken.
Sprich, wir haben zwei Links:
Weiter in der Diashow und Klick aufs Bild.
Bisher wird bei "Weiter" nur die Bild-URL getauscht.
Bei "Klick aufs Bild" wird anhand der Bild-URL die größere Variante geladen.
So, un nun brauchen wir einen "richtigen" Link.

Mein Vorschlag:
Schreib den da rein.
Sprich, wenn Du von den Minibildern in die Vorschau gehst, setzt Du das Bild via JavaScript in das href-Attribut

Du änderst das href-Attribut also mit JavaScript.

Kann gut sein, dass das nochmal so 20 Zeilen oder so werden, waber was anderes fällt mir gerade nicht ein...

gruß
Lukas
 
http://www.visoc.de/galerie/

Das ist noch ohne Lightscript! Aber hier ist der komplette Quelltext! Links ist das grosse Bild und unten rechts sind die kleinen Bilder. DerQuelltext ist aber noch nicht optimiert, bin froh das es endlich funktioniert! :D
Optimieren mache ich später noch!

Ich denke ich werde die Bildausgabe links, auch über Javascript ausgeben müssen, damit dort immer nur der Bildname erscheint und Lightbox damit klar kommt?
 
:D

Im Grunde ganz simpel:


Du schreibst den Link schon mit rein, und änderst bei dem dann zusammen mit der Bild-URL das href:


HTML:
<div id="big">
<a href="" id="targetlink" rel="lightbox">
<img src="../amsterdam/images/dsc00171.jpg" alt="France" width="390" id="target">
</a>
</div>

PHP:
function change(source) {
	
	// grosses Bild tauschen
	
	neuesbild = pfad + source;
	document.getElementById("target").src = neuesbild;
	document.getElementById("targetlink") = pfad_zum_bild;   // HIER geändert
	document.getElementById("textausgabe").innerHTML = 'Bildname: ' + source;
}

Dann müsstest Du nur noch irgendwie den pfad_zum_bild zusammenbauen, so tief hab ich da jetzt nicht reingeguckt :)

Hoffe, das klappt.
gruß
Lukas
 
Ich werds heut Abend ausprobieren, ich muss jetzt zum Wiese mähen fahren! Die Idee ist gut, an das reinschreiben an ID="target" hatte ich auch schon gedacht. Denke mal es muss nur etwas anders lauten damit es funktioniert?

Code:
  document.getElementById("big").innerHTML = '<a href='+neuesbild+' id="target" rel="lightbox"> <img src="../amsterdam/images/dsc00171.jpg" alt="France" width="390" id="target"> </a>'

[|code]
 
Mit dieser Funktion innerhalb von der Bilderwechselfunktion stimmt der Quelltext.

Code:
document.getElementById("big").innerHTML = '<a href='+neuesbild+' target="_blank" rel="lightbox"><img src='+neuesbild+' alt="Amsterdam" width="390" id="target" class="galerie"></a>';

Beim Klick auf ein anderes Bild wird so der Quelltext richtig ausgegeben.

Code:
<div id="big"><a href="../amsterdam/images/dsc00173.jpg" target="_blank" rel="lightbox[]"><img src="../amsterdam/images/dsc00173.jpg" alt="Amsterdam" id="target" class="galerie" width="390"></a></div>

Nur Lightbox funzt nicht! Es geht nur beim erstmaligen Aufruf der Seite, sobald man per JS was ändert geht nichts. Muss ich die Lightbox jetzt dauernd aufrufen wenn ich was ändere?
 
Zuletzt bearbeitet:
ARGH! Es ist so einfach!

Lightbox liest die komplette HTML Seite ein und sucht nach dem rel="Lightbox", damit arbeitet es weiter. Ändert man jetzt aber dort den Pfad ohne das Lightbox zu sagen, öffnet es immer nur das erste Bild.

Die Lösung ist einfach ein initLightbox(); nachdem man den HTML Code geändert hat! :D
Jetzt gehts! Wie Geil. :)
 
Zurück
Oben Unten