Steph: BILD IN 4 RICHTUNGEN

Hallo erstmal,
ich brauche dringend hilfe, denn ich muss wissen, wie man
ein Bild bewegt.Und das mit 4 buttons.
ich hab hier ein code:

<html>
<head>
</head>

<script language="JavaScript">
var a=200;
var b=200;

function bewegena()
{
if (a<250)
{
a++;
bild.style.top=a;
window.setTimeout ('bewegen()', 1);
}
}
function bewegenb()
{
if (a>150)
{
a++;
bild.style.bottom=a;
window.setTimeout ('bewegen()', 1);
}
}
function bewegenc()
{
if (b<250)
{
b++;
bild.style.left=b;
window.setTimeout ('bewegen()', 1);
}
}
function bewegend()
{
if (b>150)
{
b++;
bild.style.right=b;
window.setTimeout ('bewegen()', 1);
}
}
</script>
<input type="button" value="bewegena" onClick="bewegena()">
<input type="button" value="bewegenb" onClick="bewegenb()">
<input type="button" value="bewegenc" onClick="bewegenc()">
<input type="button" value="bewegend" onClick="bewegend()">
<div id ="bild"  style="position:absolute; left:200px; top:200px">
<img src = "Das Bild">
</div>
</body>
</html>

Aber es klappt nur "bewegena()" und "bewegenc()".
es will nicht nach oben oder nach rechts...

->Ich habe IE7

Bitte den Code korrigiert hinschreiben wenns geht. Danke.

  1. Versuche am besten nur mit "top" und "left" zu arbeiten.
    Wenn du dein Bild also weiter nach links bewegen willst, verkleinsert du "left" statt "right" zu vergrößern.

    1. Versuche am besten nur mit "top" und "left" zu arbeiten.
      Wenn du dein Bild also weiter nach links bewegen willst, verkleinsert du "left" statt "right" zu vergrößern.

      Wie denn?

      1. function bewegenb()
        {
        if (a>150)
        {
        a++;
        bild.style.bottom=a;
        window.setTimeout ('bewegen()', 1);
        }
        }

        Stop: Mir is noch was anderes aufgefallen. Es handelt sich hier um eine Endlosschleife.

        1. ??
          dein code ist genau wie meiner.
          aber  ich möchte wissen wie ein bild sich mach oben bewegen kann.
          (oder nach rechts)
          Es kann sein dass es am internet explorer liegt.
          ich hab IE7.
          bin mir da aber nicht so sicher...

          1. Hallo,

            dein code ist genau wie meiner.
            aber  ich möchte wissen wie ein bild sich mach oben bewegen kann.
            (oder nach rechts)

            Du weißt doch anscheinend wie es geht. (Im übrigen verschiebst du kein Bild, sondern ein <div> mit Bild drin.)

            Wenn das <div> nach links soll, verringerst du den left-Wert um eins, wenn es nach rechts soll erhöhst du ihn um eins. Das gleiche machst du mit dem Top-Wert für die Bewegung nach unten und oben.

            Es kann sein dass es am internet explorer liegt.
            ich hab IE7.

            Dann änder das doch einfach.

            Und beachte bitte Cheatahs Kommentar.

            Jonathan

        2. Hallo,

          Stop: Mir is noch was anderes aufgefallen. Es handelt sich hier um eine Endlosschleife.

          Nein, es ist keine Endlosschleife.

          Jonathan

  2. Hi,

    <html>

    kein DOCTYPE? Das ist _immer_ schlecht. Verlasse den Quirks-Mode.

    <head>
    </head>

    In HTML gibt es ein einziges Element, das man wirklich in den Code schreiben _muss_. Ausgerechnet dieses Element lässt Du aus. Gibt es dafür einen Grund?

    <script language="JavaScript">

    Und hier fehlt das zwingend benötigte type-Attribut, während language überflüssig wie ein Kropf ist.

    if (a<250)
    {
    a++;
    bild.style.top=a;

    Gibt es einen Grund, warum Du ungültige CSS-Werte vermittelst?

    window.setTimeout ('bewegen()', 1);

    Diese Funktion sehe ich nirgendwo, was macht sie?

    bild.style.bottom=a;
    bild.style.left=b;
    bild.style.right=b;

    Du bewegst nicht, Du veränderst die Größe.

    <img src = "Das Bild">

    Und hier fehlt das zwingend benötigte alt-Attribut. "Das Bild" ist zwar vermutlich nur exemplarisch gemeint; aber ich komme nicht umhin festzustellen, dass es eine ungültige URL ist.

    ->Ich habe IE7

    Auch mit der neuesten Version ist es noch immer Unfug, Primärtests im IE vorzunehmen. Verwende hierfür einen Gecko-basierten Browser wie z.B. Firefox oder Seamonkey.

    Bitte den Code korrigiert hinschreiben wenns geht. Danke.

    Was zahlst Du?

    Cheatah

    --
    X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
    X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
    X-Will-Answer-Email: No
    X-Please-Search-Archive-First: Absolutely Yes
  3. Hallo,

    der grundlegen Fehler ist folgender: Du denkst an deine vier Bewegungsrichtungen und meinst, dafür vier verschiedene Style-Attribute verändern zu müssen. Verwende nur zwei Attribute: top und left. Nach rechts bewegt sich das Bild, wenn sich left vergrößert. Nach links bewegt sich das Bild, wenn sich left _verringert_. Für top gilt das Gesagte mutatis mutandis. Pass einfach deinen Code an und beachte dabei, was Cheatah bemängelt hat.

    Alles klar?

    Nico