javascript操作css left属性的问题

bhbhxy 2012-10-30 03:34:19
问题描述:
有两个物体A和B,A移动S1的距离到达终点,B移动S2的距离到达终点,两者同时到达各自终点(S1 != S2),
并且所花的时间都是T

现在我想通过改变物体的left值,让它们同时到达各自的终点,
通过计算得出A物体单位时间内移动3.4px,B物体移动1px可以同时到达终点,但是
left属性值不能正确表示小数,只能显示整数。所以累加后得到的数值有偏差,导致两个物体不是同时到达终点的

请问怎么处理这样的问题,让两者看起来同时到达各自终点呢?
...全文
391 16 打赏 收藏 转发到动态 举报
写回复
用AI写文章
16 条回复
切换为时间正序
请发表友善的回复…
发表回复
hch126163 2012-10-31
  • 打赏
  • 举报
回复
每移动一步,在计算下一步的距离。
如果:总距离 34 分10次。平均3.4
用 四舍五入
1、3
2、 (34-3)/9 3
3、 28/8 4
...
....
KK3K2005 2012-10-30
  • 打赏
  • 举报
回复
[Quote=引用 13 楼 的回复:]

引用 8 楼 的回复:

用经过的时间/总时间 * 单位时间距离 不要用加法
浮点运算 到最后肯定是对的只要你别去取舍 x/y=z z*y == x;


另外 left 可以给浮点数的
当然 显示的话 还是一个像素为基准 不过半个像素的偏差你也能看出来?
计算机的屏幕 怎么可能精确显示呢

我是用鼠标按下一个按钮不放onmousedown,物体才运动的,鼠标抬起的时候……
[/Quote]

你不相信数学公式? 难道赛车游戏 屏幕大小不一样 会影响结果?
明显的一个 矢量计算 L = Vt (t>T?T:t)
bhbhxy 2012-10-30
  • 打赏
  • 举报
回复
[Quote=引用 8 楼 的回复:]

用经过的时间/总时间 * 单位时间距离 不要用加法
浮点运算 到最后肯定是对的只要你别去取舍 x/y=z z*y == x;


另外 left 可以给浮点数的
当然 显示的话 还是一个像素为基准 不过半个像素的偏差你也能看出来?
计算机的屏幕 怎么可能精确显示呢
[/Quote]
我是用鼠标按下一个按钮不放onmousedown,物体才运动的,鼠标抬起的时候onmouseup物体就停止运动,所以总的时间不固定,只能说是同时到达。。。
ILOVE_ASPNET 2012-10-30
  • 打赏
  • 举报
回复
那么你的终于就不能是事业 ,不好意思这里打错,本来是想说那么你的终究不好实现
ILOVE_ASPNET 2012-10-30
  • 打赏
  • 举报
回复
[Quote=引用 10 楼 的回复:]

引用 9 楼 的回复:

A物体单位时间内移动3.4px,B物体移动1px可以同时到达终点

你A移动为3.4px =小数, 而B移动=1 为整数,你终点值又是整数, 你当然不准确了,A的小数被你弄去了,你为什么不设置A移动为整数呢, 二者同一 得到移动的终点都为整数,可以解决你不少事情。

如果移动的速度是由其他因素决定的而不是人工指定的,就很可能恰好不是整数
[/Quote]

我明白,但是这样确实会不太好弄,那么你的终于就不能是事业,则考虑到A的关系 有可能出现小数,不然你怎么移也会有问题的,因为A有可能会有小数,你终于如果只定义为整数就会有偏差
bhbhxy 2012-10-30
  • 打赏
  • 举报
回复
[Quote=引用 9 楼 的回复:]

A物体单位时间内移动3.4px,B物体移动1px可以同时到达终点

你A移动为3.4px =小数, 而B移动=1 为整数,你终点值又是整数, 你当然不准确了,A的小数被你弄去了,你为什么不设置A移动为整数呢, 二者同一 得到移动的终点都为整数,可以解决你不少事情。
[/Quote]
如果移动的速度是由其他因素决定的而不是人工指定的,就很可能恰好不是整数
ILOVE_ASPNET 2012-10-30
  • 打赏
  • 举报
回复
A物体单位时间内移动3.4px,B物体移动1px可以同时到达终点

你A移动为3.4px =小数, 而B移动=1 为整数,你终点值又是整数, 你当然不准确了,A的小数被你弄去了,你为什么不设置A移动为整数呢, 二者同一 得到移动的终点都为整数,可以解决你不少事情。
KK3K2005 2012-10-30
  • 打赏
  • 举报
回复
用经过的时间/总时间 * 单位时间距离 不要用加法
浮点运算 到最后肯定是对的只要你别去取舍 x/y=z z*y == x;


另外 left 可以给浮点数的
当然 显示的话 还是一个像素为基准 不过半个像素的偏差你也能看出来?
计算机的屏幕 怎么可能精确显示呢
  • 打赏
  • 举报
回复
这种事用JQ的animate函数不是正好吗,对它来说很EZ。
bhbhxy 2012-10-30
  • 打赏
  • 举报
回复
[Quote=引用 5 楼 的回复:]

我知道,貌似浏览器并不支持0.3,等这样的像素,最少也是一像素啊
[/Quote]
有什么好的解决方案吗?或者怎么设计算法,让两者最后都同时到达终点?
maweibinguo 2012-10-30
  • 打赏
  • 举报
回复
我知道,貌似浏览器并不支持0.3,等这样的像素,最少也是一像素啊
bhbhxy 2012-10-30
  • 打赏
  • 举报
回复
[Quote=引用 3 楼 的回复:]

不是啊。。不是用计时器移动吗?

慢慢叠加,多个判断left的值是不是超最大值了,超最大值就设置left为最大值,停止计时器,不是直接让你设置left为最大值。
[/Quote]
可是我想让两个物体同时到达终点,一个物体如果达到最大值,可是另一个还没有到
Go 旅城通票 2012-10-30
  • 打赏
  • 举报
回复
不是啊。。不是用计时器移动吗?

慢慢叠加,多个判断left的值是不是超最大值了,超最大值就设置left为最大值,停止计时器,不是直接让你设置left为最大值。
bhbhxy 2012-10-30
  • 打赏
  • 举报
回复
[Quote=引用 1 楼 的回复:]

你不是知道距离了吗。。判断下是否超最大距离,超就直接设置left为最大距离,而不是最终累加的值

小数距离firefox应该支持,ie好像不行。。
[/Quote]
我想要平缓过渡的效果,如果直接设最大距离到最后物体会突然跳动,视觉效果不好
Go 旅城通票 2012-10-30
  • 打赏
  • 举报
回复
你不是知道距离了吗。。判断下是否超最大距离,超就直接设置left为最大距离,而不是最终累加的值

小数距离firefox应该支持,ie好像不行。。

87,910

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧