Franz: Diashow

Hallo

Ich möchte bei diesem Skript Dia-Show unter dem Bild folgende Angaben programmmieren: "Bild 1 von 5".

Da ich noch keine grosse Erfahrung in Javascript habe, bitte ich euch um Hilfe.

Gruss
Franz

<html>
<head>

<title>Javascript - Dia-Show!</title>
</head>

<script LANGUAGE="JavaScript">

<!--

var maxnr=7;

var aktnr=0;

var halt=1;

var an=1;

function bild(nr)

{
bld=new Array();
bld[1]="affe02.jpg";
bld[2]="affe03.jpg";
bld[3]="affe04.jpg";
bld[4]="affe05.jpg";
bld[5]="affe06.jpg";
bld[6]="affe07.jpg";
bld[7]="affe08.jpg";

if (an) {

aktnr+=nr;

if (aktnr<1)

aktnr=maxnr;

else if (aktnr>maxnr)

aktnr=1;

document.slide.src=bld[aktnr];

}

}

function show()

{

if (!halt) {

bild(1);

setTimeout("show()",3000);

}

}

function power()

{

if (!an) {

document.schalter.src="";

document.slide.src="";

aktnr=0;

halt=1;

an=1;

}

else {

document.slide.src="";

document.schalter.src="";

an=0;

}

}

// -->

</script>

<body text="#FFFFFF" bgcolor="#000000" link="#0000EE" vlink="#551A8B" alink="#FF0000" background="../images/back.gif">

<CENTER>
<p><b><font face="Verdana" size="2">Die Besucher der Vorstellungen von
"Planet der Affen" wurden <br>
von unseren Gorillas herzlich in den Saal begleitet.<br>
Die anfängliche "Angst" war schnell hinweg und manche <br>
Besucher schlossen unsere Äffchen ins Herz !</font></b></p>
<BR>

<img SRC="affe02.jpg" name="slide" ALT="Slide-Show" width="290" height="193">

<form><br>

<input TYPE="button" value=" |< " onClick="aktnr=1;bild(0);">

<input TYPE="button" value=" < " onClick="bild(-1)">

<input TYPE="button" value="Los geht's" onClick="halt=0;show()">

<input TYPE="button" value="Stop" onClick="halt=1">

<input TYPE="button" value="  > " onClick="bild(1)">

<input TYPE="button" value=" >| " onClick="aktnr=maxnr;bild(0);">

</form>

<BR>

</body>

</html>

  1. Meiner Meinung nach ist dazu DHTML nötig. Wenn du die Syntax des Document Object Models (DOM) verwenden willst, was aber nicht auf älteren Browsern läuft, solltest du es wie folgt machen:

    Im Body brauchst du ein einzelnes Tag, in das der Text reinkommt. Es muss ein id-Attribut haben. Standardmäßig drin stehen sollte der Text für das Bild, was standardmäßig angezeigt werden sollte. Das könnte etwa so aussehen:

    <div id="einText">Bild 1 von 5</div>

    Die id merken, die brauchen wir jetzt. In die Funktion bild() kommt jetzt die Zeile

    document.getElementById("einText").lastChild.data = "Bild " + aktnr + " von 5";

    in den Klammer muss die id von oben stehen.

    Wichtig: Das führt bei älteren Webbrowsern, wie Netscape 4, zu einer Fehlermeldung!

    Übrigens: Du solltest den restlichen Quellcode mal überprüfen, da sind Sachen drin, die zu Fehlern führen könnten. Ich hab jetzt leider keine Zeit dafür.

  2. Hallo!

    Ich möchte bei diesem Skript Dia-Show unter dem Bild folgende Angaben programmmieren: "Bild 1 von 5".

    function bildtext(blid_nr, anzahl)
     {
       text = "Bild " + bild_nr + " von " + anzahl;
       if(document.all) // IE
        {
          document.all.bt.innerHTML=text;
        }
       if(document.getElementById) // NN 6,7; Opera ab 6.0 (glaube)
        {
          document.getElementById('bt').innerHTML=text;
        }
       else if(document.layers) // NN4
        {
          document.bt.document.open();
          document.bt.document.write(text);
          document.bt.document.close();
        }
     }

    <div id="bt" style="position:absolute;left:20px;top:20px;"></div>

    In die Funktion bild() baust Du jetzt folgendes ein, siehe Dein quellentext.

    .
    .
    .
    function bild(nr)

    {
    bld=new Array();
    bld[1]="affe02.jpg";
    bld[2]="affe03.jpg";
    bld[3]="affe04.jpg";
    bld[4]="affe05.jpg";
    bld[5]="affe06.jpg";
    bld[6]="affe07.jpg";
    bld[7]="affe08.jpg";

    if (an) {

    aktnr+=nr;

    »»

    if (aktnr<1)

    aktnr=maxnr;

    else if (aktnr>maxnr)

    aktnr=1;

    document.slide.src=bld[aktnr];

    bildtext(aktnr, maxnr);

    }

    }
    .
    .
    .

    MfG, André Laugks

    --
    L-Andre @ gmx.de
    1. Hallo

      Besten Dank. Leider funktioniert es nicht. Wo muss ich dieses Statment einbauen?
      <div id="bt" style="position:absolute;left:20px;top:20px;"></div>

      Gruss
      Franz

      1. Hallo!

        Besten Dank. Leider funktioniert es nicht. Wo muss ich dieses Statment einbauen?
        <div id="bt" style="position:absolute;left:20px;top:20px;"></div>

        Das ist kein JavaScript sondern HTML, also ein DIV-Container. Den baut man in der Regel im body ein.

        MfG, André Laugks

        --
        L-Andre @ gmx.de