是这样的。因为比较喜欢js,而且js数组也好操作,想用网页写一个电梯模拟算法,用到了animate来表现动画效果。最开始的时候我遇到了这样的问题。假设电梯从6楼下降到1楼,那么就要生成一个从6到1楼的匀速运动动画,这个动画是一个线程。但是如果下降到了4楼的时候,突然3楼有人要上电梯,那就必须得在3楼停下来。如果在这个线程之后直接调用去3楼的线程,两个线程不会互相覆盖,而是会互相累加,它会先到1楼后上3楼,但如果在接收到3楼请求的时候立刻调用stop(true)方法停止动画并且重新生成一个动画的话,在停止的那里会卡顿一下,这样看起来好像电梯故障,不是想要的效果。经过一番查资料,我找到了step这个方法,先贴一下网上的资料代码。借用,无意冒犯这个step方法相当于把一个动画分解成无数小段,每执行一个小段就会调用一遍。并且提供了修改fx.now和fx.end的值的机会,我以为这就是我要的方法。只要接收到3楼请求的时候,修改fx.end为3楼的位置就行了。紧接着新的问题就出来了。fx.now虽然也是fx的一个属性,但这个属性不是死的,经过我查询JQuery源码,发现它是根据start、end以及移动位置百分比来计算的,一旦修改了end,now值就会改变,造成电梯突然往上抽搐一下接着下降的效果。很抱歉啰嗦了这么多,只是为了把问题说得更清楚。有没有dalao对这个方法比较熟悉,能不能帮忙想个解决办法,或者做这个电梯小程序还有没有别的表现方式?谢谢dalao
1 回答

哔哔one
TA贡献1854条经验 获得超8个赞
今天被迫查了JQuery,又经过一番尝试,终于找到了解决办法。大概有我这种问题的人很少吧,不过我还是贴一下答案吧。
虽然step提供了修改fx的属性值的一个机会,但是并不是直接修改就能解决的。在这里,fx.start和fx.end都是一成不变的,而fx.pos这个属性,代表的是动画当前状态在整个动画过程中的百分比,它的值从0到1,中间是以0.为开头的一长串小数。而fx.now代表的就是动画当前属性改变的值。
经过一番查源码,得到这样一个公式:fx.now = (fx.end - fx.start) * fx.pos + fx.start。倘若修改了fx.end的话,now值有可能会改变,就会造成中途动画突然抽搐一下的情况。所以需要修改fx.start的值。假设修改后fx.end的值为end1,修改后fx.start,设其为start1,那么
start1 = (fx.start - fx.pos * (fx.start - (fx.end - end1)))/(1 - fx.pos)
并且start只能赋值一次,接下来的step方法需要沿用赋值后的start。也就是说,设一个初始变量
var flag = truestep:function(now,fx){ fx.end = end1;//这一步用来修改fx.end的值,请根据自己需要去写。 if(flag){ fx.start = (fx.start - fx.pos * (fx.start - (fx.end - end1)))/(1 - fx.pos); flag = false; } }
添加回答
举报
0/150
提交
取消