JavaScript im Anleitungstext nutzen

Question

Hallo zusammen,

ich möchte für ein Experiment gerne eine schnelle Bildabfolge und unten drunter eine Rating Skala (horizontale Auswahl) zeigen.

Für die Bildabfolge nutze ich folgendes JavaScript:

<script type="text/javascript">
var b = new Array();
b[0] = new Image(); b[0].src = "pic1.jpg;
b[1] = new Image(); b[1].src = "pic2.jpg";
b[2] = new Image(); b[2].src = "pic3.jpg";
b[3] = new Image(); b[3].src = "noise.jpg";
var i = 0;
function Animation () {
  if (i > 4)
    i = 0;
  document.images[0].src = b[i].src;
  i = i + 1;
  window.setTimeout("Animation()", 100);
}

window.setTimeout("Animation()", 100);
</script>

Nun zum Problem: Wenn ich das Script vor der Auswahl ausführe, wird die Bildabfolge im Header des Fragenbogens (Anstelle unseres Institutslogos) dargestellt.
Ich habe daher versucht, das Script als Anweisungstext zu nutzen, aber wie auch immer ich das versuche (mittels Platzhalter oder direkt in den Anweisungstext), die Animation wird nicht gezeigt.
Kann ich JavaScript überhaupt als Anweisungstext einbinden? Jede Hilfe ist sehr willkommen.

Answer 1

Das Problem liegt hier:

document.images[0].src = b[i].src;

Sie ersetzen das erste Bild im Fragebogen. Das ist in Ihrem Fall wohl das Logo.

Fügen Sie stattdessen an geeigneter Stelle ein neues Bild ein, und ersetzen Sie dieses. Oder fügen Sie einen Platzhalter ein, z.B.

<div id="stimulus"></div>

Und dann würde Ihr Code folgendes machen:

var box = document.getElementById("stimulus");
var image = document.createElement("img");
box.appendChild(image);
...
image.src = b[i].src;

Eine weitere Möglichkeit wäre es, mit einer GIF-Animation zu arbeiten. Alt, aber sehr robust.

Comments

Das war es! Vielen Dank für die schnelle Hilfe :-)

PS: Die GIF-Animation hätte nicht funktioniert, weil die Bilder noch randomisiert werden sollen.