发新贴  快速回复

关于基础课程多个图片抖动的问题,能给个解决思路吗?

织慧星梦
2014-09-15 18:45
function shake ( obj, attr, endFn ) {
    
    var pos = parseInt( getStyle(obj, attr) );            
    
    var arr = [];            
    var num = 0;
    var timer = null;
        
    for ( var i=20; i>0; i-=2 ) {
        arr.push( i, -i );
    }
    arr.push(0);
        
    clearInterval( obj.shake );
    obj.shake = setInterval(function (){
        obj.style[attr] = pos + arr[num] + 'px';
        num++;
        if ( num === arr.length ) {
            clearInterval( obj.shake );
            endFn && endFn();
        }
    }, 50);
}


无为
思路就是想办法在运动过程中只存一次元素的left或top值,或者限制在抖动还没有结束之前不能触发下一次抖动(需要熟悉开关变量,或者自定义属性)。
2014-09-16 15:07  回复本帖
织慧星梦
forum.php?mod=redirect&goto=findpost&pid=30111&ptid=9335
思路就是想办法在运动过程中只存一次元素的left或top值,或者限制在抖动还没有结束之前不能触发下一次抖动 ...

还是没有一点头绪啊{:soso_e105:}
2014-09-16 16:31  回复本帖
无为
forum.php?mod=redirect&goto=findpost&pid=30119&ptid=9335
还是没有一点头绪啊

就是给每个抖动的元素添加一个自定义属性作为开关来控制,如果开始抖动,就把开关打开,抖动结束把开关关掉。然后在触发抖动之前判断一下,如果开关是开的,说明运动还没有结束,就不要再调用抖动函数,如果开关是关的,说明运动结束了,可以再次调用抖动函数。
2014-09-16 21:31  回复本帖
织慧星梦
forum.php?mod=redirect&goto=findpost&pid=30138&ptid=9335
就是给每个抖动的元素添加一个自定义属性作为开关来控制,如果开始抖动,就把开关打开,抖动结束把开关关 ...

位置还是会乱,这几天都在搞这个,悟性很低啊,能贴下代码吗?
2014-09-18 10:01  回复本帖
无为
forum.php?mod=redirect&goto=findpost&pid=30203&ptid=9335
位置还是会乱,这几天都在搞这个,悟性很低啊,能贴下代码吗?

把你写的代码发上来,看看你是什么地方有问题。。。
2014-09-18 17:31  回复本帖
幻天封
forum.php?mod=redirect&goto=findpost&pid=30138&ptid=9335
就是给每个抖动的元素添加一个自定义属性作为开关来控制,如果开始抖动,就把开关打开,抖动结束把开关关 ...

我也在这个地方卡了一下,不过现在弄出来了,我用的方法是在每个图片上加一个自定义属性“index=true”,下面是加判断的代码发出来互相交流一下。。

if(obj.index){//判断是否执行抖动计时器程序
    timer = setInterval(function(){
        obj.index = false;//开始抖动的时候自定义属性变为false,这样在抖动过程中即使鼠标重复移入也不重复执行计时器
        obj.style[attr] = pos + arr[num] + 'px';
        num++;
        if( num===arr.length ){
            clearInterval( timer );
            endFn && endFn();
            obj.index = true;//抖动完成,恢复自定义属性为true
        }
    },50);
    }


2014-11-30 18:17  回复本帖
yangjianfeng001
刚做的,想看看别人的做法,顺便共享一下我的思路,类似楼上的做法(7#),区别在用我使用属性记录了初始位置的值。

function shake( obj, attr, endFn ){
            
            obj.pos = obj.pos || parseInt( getStyle( obj, attr ) );
            var arr = [];
            var num = 0;
            
            for(var i=15; i>0; i-=3){
                arr.push( i, -i);    
            }
            arr.push( 0 );
            
            clearInterval( obj.shake );
            obj.shake = setInterval( function(){
                
                obj.style[attr] = obj.pos + arr[num] + 'px';
                num++;
                if( num == arr.length){
                    clearInterval( obj.shake );
                    endFn && endFn();
                }
                
            }, 50 );
            
    }

2014-12-01 16:30  回复本帖
li305263
obj.pos = obj.pos || parseInt( getStyle( obj, attr ) ); 这句话看不懂。。能解释下吗
2015-11-12 16:31  回复本帖
li305263
forum.php?mod=redirect&goto=findpost&pid=33086&ptid=9335
刚做的,想看看别人的做法,顺便共享一下我的思路,类似楼上的做法(7#),区别在用我使用属性记录了初始位 ...

[table=98%]
[tr][td]obj.pos = obj.pos || parseInt( getStyle( obj, attr ) ); 这句话看不懂。。能解释下吗[/td][/tr]
[/table]
2015-11-12 16:54  回复本帖
Miss梦
forum.php?mod=redirect&goto=findpost&pid=30111&ptid=9335
思路就是想办法在运动过程中只存一次元素的left或top值,或者限制在抖动还没有结束之前不能触发下一次抖动 ...

设置开关的方法我做出来了,但是您说的只存一次left或者top值是什么意思?
2015-11-13 16:48  回复本帖
 
幸福一点点
forum.php?mod=redirect&goto=findpost&pid=33086&ptid=9335
刚做的,想看看别人的做法,顺便共享一下我的思路,类似楼上的做法(7#),区别在用我使用属性记录了初始位 ...

你这样的方式,如果是联动式的动画,也就是先left,后top,并且left != top;这会导致后续会出问题
2016-03-04 19:43  回复本帖
登录 后才可以发表回复