1. Liebe Forumsgemeinde,

    aufgrund der Bestimmungen, die sich aus der DSGVO ergeben, müssten umfangreiche Anpassungen am Forum vorgenommen werden, die sich für uns nicht wirtschaftlich abbilden lassen. Daher haben wir uns entschlossen, das Forum in seiner aktuellen Form zu archivieren und online bereit zu stellen, jedoch keine Neuanmeldungen oder neuen Kommentare mehr zuzulassen. So ist sichergestellt, dass das gesammelte Wissen nicht verloren geht, und wir die Seite dennoch DSGVO-konform zur Verfügung stellen können.
    Dies wird in den nächsten Tagen umgesetzt.

    Ich danke allen, die sich in den letzten Jahren für Hilfesuchende und auch für das Forum selbst engagiert haben. Ich bin weiterhin für euch erreichbar unter tti(bei)pcwelt.de.
    Dismiss Notice

JavaScript und CSS

Discussion in 'Web-Know-how für die Homepage' started by computernarr, Mar 10, 2004.

Thread Status:
Not open for further replies.
  1. computernarr

    computernarr Kbyte

    Hi @ all!
    Ich hab folgendes Problem:
    Ich habne HTML datein da ist ein Bild drin die per CSS und div positioniert wurde! Jetzt will ich mit JavaScript das so machen das das Bild immer ein bisschen nach rechts geht bis zum Bildschrimrand und wieder zurück! Wie kann ich das bewerkstelligen mit JS und CSS?
     
    computernarr, Mar 10, 2004
    #1
  2. Gast

    Gast Guest

    dein div muss einen namen haben, z.b. "test" <div id="test">....</div>

    mit:

    document.getElementById("test").style.left="100";

    wird das element mit den namen "test" auf eine position von 100px von links gesetzt. egal, was vorher als left angegeben worden ist.

    probiers mal mit:
    <script>
    function bewegen()
    {
    for(var I=200;i--;i>10;)
    document.getElementById("test").style.left = i;
    }

    </script>
    <body onLoad="bewegen()">
    <div id="test" style="position:absolute;top:100;left:200"><img src="test.jpg"></div>

    bei der forschleife musste ein wenig experimentieren.... leider hab ich momentan keinen editor zur hand um es selbst zu testen.
     
    Gast, Mar 15, 2004
    #2
  3. computernarr

    computernarr Kbyte

    Kann mir niemand helfen?
     
    computernarr, Mar 13, 2004
    #3
  4. computernarr

    computernarr Kbyte

    Hier mal der Quellcode
    Code:
    <html>
<head>
<title>DIV</title>
<meta name="author" content="BBS">
<meta name="generator" content="Ulli Meybohms HTML EDITOR">
<link rel="stylesheet" href="div.css" type="text/css">
<script language="JavaScript">
function bewegen() {



document.getElementById("erde").style.left=200px;
}
</script>
<noscript></noscript>

</head>
<body >
<div id="erde" class=1 > <img src="erde.jpg" width="103" height="103" border="0" alt=""></div>
<div class=2><img src="mars.jpg" width="132" height="132" border="0" alt=""></div>
<div class=3>Hallo Bild Mars</div>
<div class=4>Wenn hier<br>
Wasser wäre?</div><br><br>
<br>
<br>
<br>
<br>
<br>
<input type="button" value="Start" onClick="bewegen()" >
</body>
</html>
    Code:
    div.1 {position: absolute; top: 50px; left: 100px; id="erde"; }
div.2 {position: absolute; top: 200px; left: 300px; }
div.3 {position: absolute; top: 185px; left: 300px; }
div.4 {position: absolute; top: 250px; left: 325px; color: #FFFFFF; }
     
    computernarr, Mar 11, 2004
    #4
  5. computernarr

    computernarr Kbyte

    Mit dem verschieben hatte ich an eine for-schleife gedacht!

    Die Id muss ich die in css zuweisen oder in HTML?
     
    computernarr, Mar 11, 2004
    #5
  6. kalweit

    kalweit Hüter der Glaskugel

    Mal so sinngemäß - die Positionierung steckt in document.getElementsById(<div-id>).style.left, diesen Wert kannst du einfach überschreiben. Nun brauchst du nur noch ein setInterval(), welches eine Funktion aufruft, in der du "left" erhöhst bzw. verringerst. Wenn das Objekt an der Ausgangsposition ist, beendest du einfach den Interval. Nun kannst du noch entscheiden, ob du das von der Browserfensterbreite abhängig machst (was die Sache ein wenig komplizierter macht) oder ob dir feste Werte reichen.

    Gruss, Matthias
     
    kalweit, Mar 10, 2004
    #6
  7. whisky

    whisky Ganzes Gigabyte

    whisky, Mar 10, 2004
    #7
Thread Status:
Not open for further replies.

Share This Page