nicht angemeldet
Hallo Chris,
Ich möchte ziemlich viele Grafiken in eine Page geben
ich möchte auch viel... ich möchte auch begrüßt werden, wenn jemand ein Frage (an mich) stellt -stellvertretend für die Forumsgemeinde gesprochen-
wie dem auch sei... bedankt hast du dich ja wenigstens :-)
Habe sowas ähnliches grade diese Woche in eine Seite (aber keine frames) gehackt. Ist sicherlich optimierungsfähig, ne wahr Antje?<g>
Da wird auch nix anderes, als ein klassischer Bildwechsel vorgenommen. Die großen Pix sind bei mir allerdings alle gleich groß, was die Sache etwas vereinfacht. Bei unterschiedlichen Bildgrößen gibtz bei Netsi Probleme weil er - auch bei <img src="gaga.gif"> OHNE height und width - die Bilder nicht "nachskaliert", wenn da vorher schon eins drin war, jedenfalls hatte ich den Effekt (Lösungsvorschlag dazu weiter unten).
Das gif (thumbnail) und das jpg (groß und schick) haben den selben Basisnamen: gugelhupf.gif -> gugelhupf.jpg
Den Pfad darauf kannst du dir ja zusammenbauen wie du lustig bist.
Die Thumbnails (Nummern werden bei mir aus 'ner DB generiert):
<a href="javascript:void()" onClick="return showPreview(0);">
<img name="icon_0" src="bugatti/bugatti_f01.gif"
width="64" height="64" border="0">
</a>
<a href="javascript:void()" onClick="return showPreview(1);">
<img name="icon_1" src="bugatti/bugatti_f01.gif"
width="64" height="64" border="0">
</a>
etc.
Zur "Vorschau" hab ich ein andere IMG mit namen "zoom" - da kann zuerst auch ein transparentes GIF drinstecken.
showPreview() bekommt die Nummer, die *hinter dem IMG-NAME* steht 0 für icon_0, 1 für icon_1 etc., hat also nix mit dem Dateinamen von dem gif/jpg zu tun. Du kannst die IMGs auch "richtig" benennen und dann den Namen übergeben, macht die Sache aber unnötig kompliziert und bringt defakto nix.
Benennen mußt du die IMG-Teile aber, wenn du nicht 100% weißt (sicherstellen kannst), wieviele Bilder auf deiner Thumbnail-Seite drauf sind, ansonsten könntest Du dich auch durch das images[]-Array hangeln und dann eben den Index des Bildes angeben - aber irgendeinen Anhaltspunkt braucht die Funktion und eine Zahl ist so ziemlich das trivialste und sicherste.
Ohne funktionierendes DOM leider nicht anderes machbar.
WIE KANN ICH DEN NAMEN DES BILDES HERAUSFINDEN??
don't yell!!
So geht's (unter anderem)
meine filestruktur ist:
dadai.html mit "icon_###" UND "zoom"
\images\bild_xy.gif ein subdir für alle gifs und jpgs
\images\bild_xy.jpg
Der Wechselbalg (so ziemlich der Originalquellcode):
(ja ich weiß - das austauschen von GIF in JPG ginge auch mit RegExp - hat abba Klein-IE4 nicht... daher einfache Stringoperationen)
function showPreview(imgNo) {
/* Anzeige des grossen Vorschaubildes
viele Einzelvariablen fuer die Zwischenberechnungen,
die man sicher auch zusammenfassen kann - es kürzt aber
auch diese Beispielzeilen
*/
var bigPic, miniPic, picPath, urli, icn;
// img-objekt des thumbs abgreifen
icn = document.images["icon_"+imgNo];
// src des GIFs holen
miniPic = icn.src.toString(); // .toString() muß nicht sein
// hatt aber mal probs ohne
urli = miniPic.split("/"); // pfad zerlegen in ein array
miniPic = urli[urli.length-1]; // filename steht im letzten element
bigPic = urli[urli.length-2]; // subdir ("images") 'türlich davor
// da beide im selben dir sind gleich in bigPic speichern
// schnippel Name bis zum "." von "bildname.gif" und dranhängen
bigPic += "/" + miniPic.substr(0, miniPic.lastIndexOf(".") );
// kleb .jpg dran
bigPic +=".jpg";
// jpg anzeigen
document.images["zoom"].src=bigPic;
return false;
}
Du brauchst also nur *eine* Zielseite mit einem IMG name="zoom" um dort das Grossbild auszutauschen.
Wenn die Bilder unterschiedlich groß sind, dann pack das IMG in einen
LAYER (positioniertes DIV) und schreib dort per document.write einfach ein
<img src="dasgroße.jpg">
rein - OHNE width und height.
Dann läd auch Netsi das Bild in seiner Originalgröße.
Layers und DIV von "aussen" über Frames und was auch immer schreiben, wurde ca. 46.591.045 mal im Forum beantwortet und steht auch in SelfHTML (bitte selber suchen, danke).
Gäbe da noch ein Menge andere Möglichkeiten das Bild in den anderen Frame zu bringen*) - aber du hast ja den Dateinamen gesucht und den hast du jetzt ;-)
Viel Spaß
CirTap
*) u.a.
-
zielframe.location mit ziel.html?grossbild=dateiname.jpg
-
top.window.name = bildname
in zielframe -> ziel.html laden
in beiden fällen:
ziel.html onLoad() holt sich den Bildnamen aus
top.window.name oder dem URL-Parameter (.search)
wechselt das bild oder "schreibt" eines rein. -
haste PHP oder so? dann: ziel.php3?bild=dateiname
und der PHP-Script generiert den HTML-Code - das
waäre dann ohne JS
das sollte wohl genügen...