Question

元素位置属性，尤其是'left'属性，我遇到了问题。我在css中创建了一个灰色块形状，并在js中将其旋转了0.17rad。我想在屏幕上对角移动块，以使其每20毫秒移动3px的距离。如果您使用过时的SOHCAHTOA和pythagoras定律，则每20ms就会在左侧显示 0.5075470472px ，在向上显示 2.956754301px 。

html：

<html lang='en'>
<head>
    <meta charset="UTF-8">
    <link rel='stylesheet' href='.css'>
</head>
<body>
    <div id='block'></div>
    <script src='.js'></script>
</body>
</html>

css：

#block {
   width: 19px;
   height: 31px;
   position: absolute;
   background-color: grey;
}

js：

var block = document.getElementById('block');

block.style.left = '0px';
block.style.top = '500px';
block.style.transform = 'rotate(0.17rad)';

setInterval(function() {
   block.style.left = (parseInt(block.style.left) + 0.5075470472) + 'px';
   block.style.top = (parseInt(block.style.top) - 2.956754301) + 'px';
}, 20);

在我的情况下，该块在向上方向正确移动，但在左方向完全不移动。有什么想法吗？

Answer 1

DI将数字四舍五入，您需要使用parseInt：

parseFloat

Element.style.left属性拒绝取值？

1 个答案: