Natürlich könnte man jetzt sagen: das neue Skript kommt auch in den head-Bereich.
Da hätte man denn auch recht. Das Problem ist eher, dass es dort, zusammen mit dem Skript, das wir
schon haben, schon beim Laden der Seite ausgeführt würde. Wir müssen unser neues Skript so lange
"auf Abruf" bereit halten, bis es wirklich gebraucht wird.
Hier siehst du, wie wir unseren Skript-Abschnitt erweitern. Grau ist, was schon jetzt dort ist, gelb ist, was jetzt neu dazu kommt:
<script type="text/javascript">
var text = "Homepapa for President!" ;
var abstand = 20 ;
var sx = 200 ;
var sy = 200 ;
for(i=0 ; i<text.length ; i++) {
meinx = sx + i*abstand ;
meiny = sy ;
document.writeln('<div id="f_' + i + '"'
+ ' class="flatter"'
+ ' style="top: ' + meiny + 'px ; left: ' + meinx + 'px ">'
+ text.substr(i,1) + '</div>') ;
}
function bewegen(neux,neuy) {
for(i=0 ; i<text.length ; i++) {
meinx = neux + i*abstand ;
meiny = neuy ;
meini = "f_" + i ;
document.getElementById(meini).style.left = meinx + "px" ;
document.getElementById(meini).style.top = meiny + "px" ;
}
}
</script>
Da hab ich nun noch etwas hinzugefügt:
function bewegen(neux,neuy) { ... unser neues Skript ... }
Diese "Verpackung", in der unser neues Skript nun steckt, hat zwei Auswirkungen:
bewegen.Ein gutes und flexibles Konzept. Ergänze also den Script-Teil deiner HTML-Seite wie hier vorgegeben, und dann wollen wir mal sehen, wie man so eine Bewegung auslösen kann.