rattli: Bilderbuch

Kann mir jemand helfen?
Wie kann ich das jeweilige Bild, das gerade zu sehen ist, mit einem Button größer machen?
Wo müßte ich was im Javascript-Code ändern?
Bitte, bitte helft mir. Ich habe schon so viel probiert. Ich weiß einfach nicht weiter.

<html>
<head>
<title>...</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
a { text-decoration: none; }
a:link { color: #000000; }
a:visited { color: #000000; }
a:hover { color: #0099FF; }
a:active { color: #0099FF; }
//-->
</style>
</head>

<body onload="gallery()" bgcolor="#FFFFFF" leftmargin=0 topmargin=0 frameborder=0 framespacing=0 marginheight=0 marginwidth=0 vlink="#0099FF" alink="#0099FF">
<table width="100%" border="0" cellspacing="0" cellpadding="0" height="100%">
  <tr align="center" valign="middle">
    <td>
      <p><font face="Arial, Helvetica, sans-serif" size="3"><b><font color="#0099ff">Bildergalerie</font></b></font></p>
      <p>
        <script language="JavaScript">
<!--
var i = 1
images = new Array
images[1] = "contest1k/1k.jpg"
images[2] = "contest1k/2k.jpg"
images[3] = "contest1k/3k.jpg"
images[4] = "contest1k/4k.jpg"
images[5] = "contest1k/5k.jpg"
images[6] = "contest1k/6k.jpg"
images[7] = "contest1k/7k.jpg"
images[8] = "contest1k/8k.jpg"
images[9] = "contest1k/9k.jpg"
images[10] = "contest1k/10k.jpg"
images[11] = "contest1k/11k.jpg"
images[12] = "contest1k/12k.jpg"
images[13] = "contest1k/13k.jpg"
images[14] = "contest1k/14k.jpg"
images[15] = "contest1k/15k.jpg"
images[16] = "contest1k/16k.jpg"
images[17] = "contest1k/17k.jpg"
images[18] = "contest1k/18k.jpg"
images[19] = "contest1k/19k.jpg"
images[20] = "contest1k/20k.jpg"
images[21] = "contest1k/21k.jpg"
images[22] = "contest1k/22k.jpg"
images[23] = "contest1k/23k.jpg"
images[24] = "contest1k/24k.jpg"
images[25] = "contest1k/25k.jpg"
images[26] = "contest1k/26k.jpg"
images[27] = "contest1k/27k.jpg"
images[28] = "contest1k/28k.jpg"
images[29] = "contest1k/29k.jpg"
images[30] = "contest1k/30k.jpg"
images[31] = "contest1k/31k.jpg"
images[32] = "contest1k/32k.jpg"
images[33] = "contest1k/33k.jpg"
images[34] = "contest1k/34k.jpg"
images[35] = "contest1k/35k.jpg"
images[36] = "contest1k/36k.jpg"
images[37] = "contest1k/37k.jpg"
images[38] = "contest1k/38k.jpg"
images[39] = "contest1k/39k.jpg"
images[40] = "contest1k/40k.jpg"
images[41] = "contest1k/41k.jpg"
images[42] = "contest1k/42k.jpg"
images[43] = "contest1k/43k.jpg"
images[44] = "contest1k/44k.jpg"
images[45] = "contest1k/45k.jpg"
images[46] = "contest1k/46k.jpg"
images[47] = "contest1k/47k.jpg"
images[48] = "contest1k/48k.jpg"
images[49] = "contest1k/49k.jpg"
images[50] = "contest1k/50k.jpg"
images[51] = "contest1k/51k.jpg"
images[52] = "contest1k/52k.jpg"
images[53] = "contest1k/53k.jpg"
images[54] = "contest1k/54k.jpg"
images[55] = "contest1k/55k.jpg"
images[56] = "contest1k/56k.jpg"
images[57] = "contest1k/57k.jpg"
images[58] = "contest1k/58k.jpg"
images[59] = "contest1k/59k.jpg"
images[60] = "contest1k/60k.jpg"
images[61] = "contest1k/61k.jpg"
images[62] = "contest1k/62k.jpg"
images[63] = "contest1k/63k.jpg"
images[64] = "contest1k/64k.jpg"
images[65] = "contest1k/65k.jpg"
images[66] = "contest1k/66k.jpg"
images[67] = "contest1k/67k.jpg"
images[68] = "contest1k/68k.jpg"
images[69] = "contest1k/69k.jpg"
images[70] = "contest1k/70k.jpg"
images[71] = "contest1k/71k.jpg"
images[72] = "contest1k/72k.jpg"
images[73] = "contest1k/73k.jpg"
images[74] = "contest1k/74k.jpg"
images[75] = "contest1k/75k.jpg"
images[76] = "contest1k/76k.jpg"
images[77] = "contest1k/77k.jpg"
images[78] = "contest1k/78k.jpg"
images[79] = "contest1k/79k.jpg"
images[80] = "contest1k/80k.jpg"
images[81] = "contest1k/81k.jpg"
images[82] = "contest1k/82k.jpg"
images[83] = "contest1k/83k.jpg"

function gallery() {
 if (i == 1) {
  document.gallery.previous.value="";
 }
}

function previmg() {
 if (i != 1) {
  i --
  document.img.src = images[i]
  document.gallery.next.value = "Nächstes >"
 }
 if (i == 1) {
  document.gallery.previous.value="";
 }
}

function nextimg() {
 if (i != 83) {
  i ++
  document.gallery.previous.value="< Vorheriges"
  image = images[i]
  document.img.src = image
 }
 if (i == 83) {
  document.gallery.next.value="";
 }
}

function firstimg() {
 i = 1
 document.img.src = images[i];
 document.gallery.previous.value=" ";
 document.gallery.next.value="Nächstes >"
}

function lastimg() {
 i = 83
 document.img.src = images[i];
 document.gallery.next.value=" ";
 document.gallery.previous.value="< Vorheriges";
}

function stoperror() {
 return true
}

window.onerror=stoperror
//-->
</script>
        <img name="img" src="contest1k/1k.jpg" border="0"><br>
      </p>
      <div align="center">
<form name="gallery">
          <p><a href="javascript:firstimg()"><img src="../pfeile/anfang.jpg" width="11" height="15" border="0" align="absmiddle" name="first" alt="zum Anfang"></a>
                <a href="...">vergrößern</a>   <a href="javascript:previmg()"><img src="../pfeile/links.jpg" name="previous" width="7" height="15" border="0" align="absmiddle" alt="Bild zurück"></a>       
            <a href="javascript:nextimg()"><img src="../pfeile/rechts.jpg" width="7" height="15" border="0" name="next" align="absmiddle" alt="Bild vor"></a>
                  <a href="javascript:lastimg()"><img src="../pfeile/ende.jpg" width="11" height="15" name="last" border="0" align="absmiddle" alt="zum Ende"></a>
          </p>
          </form>
</div>
      <font size="2" face="Arial, Helvetica, sans-serif" color="#000000"> <b><a href="vergangene.htm" target="mainFrame"><font color="#CCCCCC">[
      </font> next Contest<font color="#CCCCCC"> ]</font></a>   
      <a href="../news.htm" target="mainFrame"> <font color="#CCCCCC">[ </font>exit<font color="#CCCCCC">
      ]</font></a></b></font></td>
  </tr>
</table>
</body>
</html>

Danke für Eure Hilfe!!!
rattli

  1. Hallo,

    Du willst, daß das Bild mit einem Button 'Vergrößern' größer wird?
    Angenommen Du setzt, daß alle Bilder immer mit einer höhe von 500px angezeigt werden, also
    <img name="img" src="contest1k/1k.jpg" border="0" height="500">
    dann macht
    document.img.style.height="750";
    das Bild 1.5 mal so groß wie vorher....

    weiß nich ob das hilft

    jonas

  2. Kann mir jemand helfen?
    Wie kann ich das jeweilige Bild, das gerade zu sehen ist, mit einem Button größer machen?
    Wo müßte ich was im Javascript-Code ändern?
    Bitte, bitte helft mir. Ich habe schon so viel probiert. Ich weiß einfach nicht weiter.

    Hallo,
    ich hab mir nicht alles durchgesehn, aber was mir gleich aufgefallen ist, ist das hier:

    var i = 1
    images = new Array
    images[1] = "contest1k/1k.jpg"

    (81 Zeilen zwischendrin gelöscht)

    images[83] = "contest1k/83k.jpg"

    das sollte man so machen

    for (i=1; i<=83; i++) images[i]="contest1k/"+i+"k.jpg";

    Da werden die Bilder aber nicht vorgeladen. Soll vielleicht ja auch nicht sein, wenns so viele sind.

    Mit browserkompatiblen Bildvergrößern würde ich das so machen (geht nur wenn alle Bilder auf die gleiche Größe gebracht werden sollen):

    mach ein kleines Bild mit

    <img src="transparent.gif" width=50 height=50>

    und ein großes Bild mit

    <img src="transparent.gif" width=200 height=200>

    wenn Du ein Bild klein darstellen willst, mach

    document.images[0].src="kleinesbild.gif"

    und bei großem Bild mach

    document.images[1].src="grossesbild.gif"

    (vorausgesetzt das sind die ersten Beiden Bilder im document).

    Das kleine Bild wird dann immer die Größe 50x50 und das große Bild imer die Größe 200x200 auf dem Bildschirm haben, unabhängig von der wirklichen Größe der zugewiesenen gif-Dateien.

    Gruß, Lutz.