• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Wanderndes Bild

Status
Für weitere Antworten geschlossen.
J

javaker

Neues Mitglied
Hallo erstmal :smile:

kommen wir zu meinem ersten Problem hier :P

Ich möchte ein Bild auf meiner seite "Wandern" lassen.
Dazu habe ich eine zeitschaltung per javascript erstellt, welche
die position des bildes verändern soll.
Leider läuft es nicht und mich würde brennend interessieren warum ?
vielen dank schonmal ! :)

var id;

function load(id)
{
if(id == 1){
document.body.getElementById('pic').style.right="0px";
window.setTimeout('load(2)', 500);
}

if(id == 2){

document.body.getElementById('pic').style.right="-10px";
window.setTimeout('load(3)', 500);
}

if(id == 3){

document.body.getElementById('pic').style.right="-20px";
window.setTimeout('load(4)', 500);
}
if(id == 4){

document.body.getElementById('pic').style.right="-30px";
window.setTimeout('load(5)', 500);
}
if(id == 5){

document.body.getElementById('pic').style.right="-40px";
window.setTimeout('load(1)', 500);
}


}
</script>

------------------

<body onLoad="load(1)">

<img src="./txt.png" style="position:absolute;right:0;top:-40;z-index:1;" id="pic">

</body>
 
Ist eine Testpage .. bin nocvh totaler anfänger und die Site ist noch nicht online.

Klar lenken solche funktionen vom Inhalt ab, es soll auch nur dazu dienen Praxiserfahrung zu bekommen.

Habe das Problem inzwischen selber lösen können:

habe in der Funktion in document.body.getElementById suchen lassen,
dabei ist das Element "body" überflüssig gewesen.


Trotzdem vielen Dank =)
 
Jep, getElementById() ist eine Methode des Document-Objekts. Leider kam meine Antwort zu spät.

Da wäre aber noch einiges an Code zu sparen, wenn du die Variable id immer nur erhöhen würdest und nach id == 5 einfach load() nicht mehr aufrufst. setInterval() wäre auch besser als immer wieder ein Timeout zu erzeugen.
 
crash schrieb:
Jep, getElementById() ist eine Methode des Document-Objekts. Leider kam meine Antwort zu spät.

Da wäre aber noch einiges an Code zu sparen, wenn du die Variable id immer nur erhöhen würdest und nach id == 5 einfach load() nicht mehr aufrufst. setInterval() wäre auch besser als immer wieder ein Timeout zu erzeugen.
Zum Vergrößern anklicken....

Danke für den überaus hilfreichen tipp ;)
hab tatsächlich eine Menge Code gespart^^

Hier der neue vollständige Code:

var switcher = window.setInterval("load()", 50);
var pol = 305;
function load()
{
{
document.getElementById('pic').style.left=pol+"px";
pol = pol + 20;
}
if (pol>=770)
{
window.clearInterval(switcher);
document.getElementById('pic').style.left="775px";
}
}


zum aktivieren: <body onLoad="(switcher)"

klappt super

vielen dank :)
 
Komische Klammersetzung hast du. Ein Glück, dass es trotzdem funktioniert. So sieht's besser aus:

Code: 
var switcher = setInterval(load, 50);
var pol = 305;
function load() {
    document.getElementById('pic').style.left = pol + "px" ;
    pol = pol + 20;
    if (pol >= 770) {
        window.clearInterval(switcher);
        getElementById('pic').style.left = "775px";
    }
}
Ausgeführt wird auch sicher ohne onload-Event. Aber das Element sollte zu dem Zeitpunkt noch nicht gefunden werden.
 
javaker schrieb:
Leider läuft es nicht und mich würde brennend interessieren warum ?
Zum Vergrößern anklicken....
Dann schau in die Fehlerkonsole. Da stehen die Laufzeitfehler!

Hier ist auch noch ein Fehler:
document.body.getElementById('pic').style.right="0 px";

Die Leerzeichen zwischen der 0 und der Einheit (px) sind nicht erlaubt. Dass das hier nicht auffällt, liegt wohl daran, dass die 0 alleine gültig ist.
 
crash schrieb:
Komische Klammersetzung hast du. Ein Glück, dass es trotzdem funktioniert. So sieht's besser aus:

Code: 
var switcher = setInterval(load, 50);
var pol = 305;
function load() {
    document.getElementById('pic').style.left = pol + "px" ;
    pol = pol + 20;
    if (pol >= 770) {
        window.clearInterval(switcher);
        getElementById('pic').style.left = "775px";
    }
}
Ausgeführt wird auch sicher ohne onload-Event. Aber das Element sollte zu dem Zeitpunkt noch nicht gefunden werden.
Zum Vergrößern anklicken....

Das es ohne das OnLoad Event funktioniert ist mein nächstes Problem...
Denn ich möchte nun das die funktion erst ausgeführt wird wenn ich einen Button klicke.. da die Variable aber automatisch startet und nicht erst aktiviert werden muss weiß ich nicht wie ich das realisieren soll.
Habe es schon damit versucht die Variable in eine eigene function zu stecken,.. hat aber genauso wenig funktioniert wie die Variable mit in die Load() function zu stecken.


EDIT: Habs doch noch hingekriegt indem ich die Variable mit in die Load() function gepackt habe
 
Zuletzt bearbeitet:
Status
Für weitere Antworten geschlossen.

Neueste Beiträge

Zurück
Oben