我认为有更好的方法可以做到这一点,也许有人可以指出我的错误。
我通过向上和向下计数来推动盒子阴影模糊css属性,并在函数启动后自动调用它。
由于某种原因,我无法将参数传递给第一次传递的setTimeout调用。
关于如何更简洁地编写此内容的任何想法?
它可以工作,但是最好泛化它以动画其他CSS属性。
var pulseBoxShadowBlurCounter = 0;
var pulseBoxShadowBlurDirection;
$(document).ready(function() { // dom binds
pulseBoxShadowBlur($('#getData-btn'),14,'#fff',100); // start the process
});
function pulseBoxShadowBlur(pulseElement,max,color,delayTime){
var cssInput = '0px 0px '+pulseBoxShadowBlurCounter+'px '+color;
$(pulseElement).css('box-shadow', cssInput);
if(pulseBoxShadowBlurCounter == max){
pulseBoxShadowBlurDirection = 1; // backwards
}
if(pulseBoxShadowBlurCounter == -5){ // negative num for pause at 0 time
pulseBoxShadowBlurDirection = 0; // forward
}
if(pulseBoxShadowBlurDirection == 0){
pulseBoxShadowBlurCounter++;
}else{
pulseBoxShadowBlurCounter--;
}
setTimeout( "pulseBoxShadowBlur($('#getData-btn'),14,'#fff',100);",delayTime ); // loop
}
最佳答案
您可以:
setTimeout(function() { pulseBoxShadowBlur(element, max, color, delayTime); }, delayTime);
通常,将某些JavaScript代码的字符串版本作为
setTimeout()
或setInterval()
的第一个参数传递是一个坏主意。而是传递一个函数。