简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
javascript - Warum funktioniert style.left bei Verwendung von JS zum Ändern des Positionsattributs eines Elements, aber style.top schlägt fehl?
PHP中文网
PHP中文网 2017-05-19 10:38:38
0
1
628

F. Ich möchte die Verschiebefunktion in JS verwenden, um die diagonale Linie des kleinen Bildes nach unten zu verschieben, aber der Code ist fast derselbe. Die linke Seite kann verschoben werden, die obere jedoch nicht 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>台球桌</title>
<style type="text/css">
*{
    padding:0;
    margin:0;
}
p{
    background:url(../PICTURE/table.JPG) no-repeat;
    height:260px;
    width:465px;
}
#ball{}
</style>
<script>
function init(){
    var timer = setInterval("move()",50);    
}
function move(){
    var ball = document.getElementById("ball");
    left = parseInt(ball.style.left);
    left += 1;
    top = parseInt(ball.style.top);
    top += 1;
    ball.style.left = left + "px";
    ball.style.top = top + "px";    
}
</script>
</head>

<body onload="init()">
<p>
<img src="../PICTURE/ball.png" id="ball" style="position:absolute;left:6px;top:5px;"/>
</p>
</body>
</html>
PHP中文网
PHP中文网

认证0级讲师

Antworte allen(1)
给我你的怀抱
给我你的怀抱2017-05-19 10:40:38 1 Etage 
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>top</title>
</head>
<body>

<p style="width: 100px;height: 100px;position: absolute;top: 10px;left: 10px;background-color: #1b6d85" id="ball"></p>
<script type="text/javascript">
  function init(){
    setInterval("move()",100);
  }
  function move(){
    var ball = document.getElementById("ball");
    var left = parseInt(ball.style.left);
    left += 1;
    var top = parseInt(ball.style.top);
    top += 1;
    ball.style.left = left + "px";
    ball.style.top = top + "px";
  }
  init();
</script>
</body>
</html>

希望您严格按照W3C标准来写JS代码。

Wie +0
Antwort hinzufügen
Beliebte Themen
Mehr>
Populäre Artikel
Beliebte Tutorials
Mehr>
Verwandte Tutorials
Beliebte Empfehlungen
Aktuelle Kurse
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website：Online-PHP-Schulung für das Gemeinwohl，Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln！