Fotoalbum in html - wie Größe der Fotos ändern?

[klari]

Hallo!

Ich hab von der Seite SELFHTML: Dynamisches HTML / Beispiele für die Praxis / Bilderbuch zum Umblättern
das Fotoalbum für meine Homepage übernommen. Funktioniert auch soweit, abgesehen davon, dass die Fotos alle winzig (bis auf einzelne, die dafür riesengroß) angezeigt werden. Die angezeigte Größe entspricht nicht der tatsächlichen Größe der Fotos.
Weiß jemand, wo ich die Größe ändern kann? An jeden, der mir helfen kann, schon im Vorhinein ein RIESIGES Dankeschön!
(Direkt im 1. Absatz, wo ich die Bilder einfüge, darf ich sonst nichts notieren!)
Ach ja, und weiß zufällig auch jemand, wie man zu den enzelnen Fotos Bildunterschriften/Erklärungen einfügen kann? (wie oben gesagt, z.B. <alt="#"> funktioniert nicht!)

[developr]

Hallo Klari,

wo ist denn deine Bildergallerie zu sehen?
Dann würde ich dort mal einen Blick raufwerfen ;-).

[klari]

Ich hab sie leider noch nicht online gestellt (die ganze Website befindet sich noch im Aufbau...)
Gibt's eine andere Möglichkeit?
Vielleicht helfen dir die Fotos und der Quelltext?!

[Paze]

function Init () {
  bildbereich = getElement("id", "Bildbereich");
  if (DOM && document.createElement && bildbereich.appendChild) {
    var img = document.createElement("img");
    img.setAttribute("src", Bild[0].src);
    bildbereich.appendChild(img);
  } else if (MSIE4) {
    bildbereich.innerHTML = '<img src="' + Bild[0].src + '">';
  } else if (NS4) {
    setContent("id", "Bildbereich", null,
      '<img src="' + Bild[0].src + '">');

im Roten teil werden die sind die <img> tags, versuch hier mal die width und height daten anzugeben.

Desweiteren ein Tipp von mir, versuch in Dateinamen keine Leerzeichen zu verwenden ("Maifest (3).jpg"). Lokal stellt das kein Problem da, aber später auf der Website, die im Internet erreichbar ist, kann das schonmal zu Problemen führen.

lg Paze

[klari]

Meinst du etwa so:

bildbereich.innerHTML = '<img src="' + Bild[0].src + '" width=500px>';
  } else if (NS4) {
    setContent("id", "Bildbereich", null,
      '<img src="' + Bild[0].src + '" width=500px>');

(Versteh deinen Satz nicht ganz, sorry!)

im Roten teil werden die sind die <img> tags,

Auf jden Fall ändert sich die Größe nicht! :-(

[Paze]

oh shit
Sorry, war deutlich übermüdet =)

Ich meinte das in den <img> Tags die Bilder eingearbeitet werden, das es eventuell, dort die Größe festgelegt werden kann.

Versuchs mal so. Wenn das auch nicht klappt tut es mir leid, konnte mich noch nich wirklich mit deinem Problem befassen, und hab nach ner schnellen lösung gesucht.

bildbereich.innerHTML = '<img src="' + Bild[0].src + '" width="500">';
  } else if (NS4) {
    setContent("id", "Bildbereich", null,
      '<img src="' + Bild[0].src + '" width="500">');

[developr]

Hallo Klari,

so wie du deinen Quelltext gepostet hast, scheint es bei mir zu funktionieren. Die Bilder werden immer schön weitergeblättert und es wird immer ein Ausschnitt der selben Größe angezeigt.

Magst du nochmal die verwendeten Bilder, Grafiken und das CSS schicken?

[klari]

an Paze: kein Problem - dein Vorschlag funktioniert leider auch nicht!
an developr: Bei den Bildern, die du verwendet hast, wird da wirklich nur ein "Ausschnitt" (wie du geschrieben hast) angezeigt oder schon das ganze Bild?
Ich kann leider die Originalfotos nicht schicken (wegen Datenschutz etc, muss ich erst noch abklären), aber ich habs grad mit anderen Fotos von mir versucht, sogar in 2 verschiedenen Größen, die wurden alle riesengroß angezeigt. Kanns irgendwie an den dpi (wenn schon nicht an der Auflösung) liegen?
-> Kann aber auch nicht sein, weil auch Bilder, die ich aus dem Internet hab, riesig angezeigt werden. (Wenn das erste Foto der Reihe groß angezeigt wird, werden alle folgenden groß angezeigt. Wenn aber das erste winzig angezeigt wird, müssen nicht alle folgenden auch winzig sein.)

Ich finde nirgends im Internet ein Alternativ-Album ohne Thumbnails (muss ich nicht haben). Auf der Seite von Stu Nicholls (http://www.stunicholls.com/gallery/index.html) gibt's zwar tolle Alben, aber die sind umständlich zu ändern, wenn ich neue FOtos einfügen möchte. Gibt's eine einfache Variante?

[developr]

Mit PHP ließe sich da was einfaches zaubern. Dann brauchst du nur die Bilder in einen Ordner werfen und da würden sie automatisch ausgelesen und angezeigt werden.

http://de3.php.net/manual/de/function.scandir.php

[klari]

Hallo!

Schön langsam verzweifle ich! Jetzt hab ich's mit SImpleViewer und Jalbum versucht, aber nichts passt für meine Verhältnisse. Das erste Beispiel von mir funktioniert auch nicht. Grrr....

Meinst du dieses Beispiel:

<?php
$dir=scandir("photos");
$exclude=array("photos/.","photos/..","photos/ex");
$photos=array();
for ($x=0; $x<count($dir); $x++){
$dir[$x]="photos/".$dir[$x];
if (is_dir($dir[$x]) && !in_array($dir[$x], $exclude)){
$thisfolder=scandir($dir[$x]);
for ($f=0; $f<count($thisfolder); $f++)
if (strpos(strtolower($thisfolder[$f]), ".jpg"))
$photos[]=$dir[$x]."/".$thisfolder[$f];
}
}
$rand=rand(0, count($photos));
echo "<div style='text-align: center;'>";
echo "<img src='".$photos[$rand]."' alt='' style='width: 80%'/>";
echo "</div>";
?>

Mit PHP kenne ich mich nicht aus, leider? Wo (head, body etc) muss ich das Beispiel einfügen, wo die Bilder, wo den Ordner, in dem die Bilder sind?