使用javascript更改边框宽度并包含位置偏移

我试图在一段时间内更改div的边框宽度，并将div的位置偏移相等的量。 增量计算为：增量宽度/增量时间（时间在for循环中导出）

这给了我这样的值（例如）

因此，如果我增加宽度：

___ .style.borderWidth =(current += widthchange)+"px "+current+"px "+current+"px "+current+"px"

和偏移定位（在这种情况下）

当变化发生时，div来回轻微抖动

问题是宽度被四舍五入到最接近的像素（我相信），而位置不是。 我尝试过许多舍入组合，但除非增量是一个整数，否则宽度调整和偏移量并不完全相等

是否有人可以确认，将四舍五入到最近的像素是宽度发生的情况？或者给我一些建议如何让它正常工作

---

谢谢

您可以通过以下方式解决此问题：

计算所需的移动量

四舍五入（或截断）为整数值

计算新整数移动量的步数

计算最后一步精确对齐所需的像素数

代码看起来像这样，我想当我快速写出一些未经测试的代码时

var totalWidth = width2-width1; // must be positive
var count = t2-t1; // must be positive
var widthchange = totalWidth/count; 

var iWidthChange = Math.floor(widthchange);
var pixelsToMove = Math.floor(totalWidth / iWidthchange);
var finalPixelsToMove = totalWidth - (pixelsToMove * count);

for (var i=0 ; i < (t2-t1); ++i) {
    ... move one increment of 'pixelsToMove' ...
}
... move one final increment of 'finalPixelsToMove'

var totalWidth=width2-width1；//必须是肯定的
变量计数=t2-t1；//必须是肯定的
变量宽度变化=总宽度/计数；
var iWidthChange=数学地板（宽度变化）；
var pixelsToMove=数学地板（总宽度/iWidthchange）；
var finalPixelsToMove=总宽度-（像素移动*计数）；
对于（var i=0；i<（t2-t1）；+i）{
…将“像素移动”的增量移动一次。。。
}
... 移动“finalPixelsToMove”的最后一个增量

你会拉小提琴吗。是的，我相信像素必须是整数。无法显示部分像素。这是一个不好的数字，但如果它是2.193333333---console.log（uuuuuuuu.style.borderWidth）=2.1934px currentpx curpx curpx curpx---那么它会四舍五入，但这不是一个整数

___ .style.borderWidth =(current += widthchange)+"px "+current+"px "+current+"px "+current+"px"

___.style.top =(current -= widthchange)+"px "+current+"px "+current+"px "+current+"px"

var totalWidth = width2-width1; // must be positive
var count = t2-t1; // must be positive
var widthchange = totalWidth/count; 

var iWidthChange = Math.floor(widthchange);
var pixelsToMove = Math.floor(totalWidth / iWidthchange);
var finalPixelsToMove = totalWidth - (pixelsToMove * count);

for (var i=0 ; i < (t2-t1); ++i) {
    ... move one increment of 'pixelsToMove' ...
}
... move one final increment of 'finalPixelsToMove'