2 chaiwa19800624 chaiwa19800624 于 2015.06.21 17:24 提问

js运动的一个问题,为什么第一个函数不执行

#box{width: 100px;height: 100px;background: red;position: absolute;left: 0;top: 0;}

js======

function act(obj, attr, target, fn){
clearInterval(obj.timer);
obj.timer = setInterval(function(){
var cur = parseInt(css(obj, attr));
var speed = (target - cur) / 8;
var stop = true;
speed = speed > 0 ? Math.ceil(speed) : Math.floor(speed);
if(target != cur){
stop = false;
}
obj.style[attr] = speed + cur + 'px';
if(stop){
clearInterval(obj.timer);
obj.timer = null;
fn && fn.call(obj);
}
}, 20);
}

var box=document.getElementById('box');
act(box,'top',300);
act(box,'left',300);
为什么我这样调用只执行了第二个函数?

2个回答

bdmh
bdmh   Ds   Rxr 2015.06.21 17:36

先确认是没执行,还是执行了没效果,估计是没效果,没执行不应该

danielinbiti
danielinbiti   Ds   Rxr 2015.06.21 18:14
看代码,函数
function act(obj, attr, target, fn){
clearInterval(obj.timer);//这里clear定时器

 act(box,'top',300);//第一句执行,
act(box,'left',300);//第二句执行后立马就clearInterval(obj.timer);了,所以第一句没效果
Csdn user default icon
上传中...
上传图片
插入图片
准确详细的回答,更有利于被提问者采纳,从而获得C币。复制、灌水、广告等回答会被删除,是时候展现真正的技术了!
其他相关推荐
原生JS 封装运动函数
在学原生JS之前,一直用jQuery 写运动,各种方便,但是不知其所以然,今天得空看了一个javascript 视频教程(这里不说了,以防广告的嫌疑),只能用一个词语形容之后的感觉-------醍醐灌顶。 /* - obj 指的是DOM对象 - json 指的是 CSS样式 - 例 startMove(oDiv,{width:100,height:100},function(){}) *
自己实现js运动框架的一些心得
以前学了js的动画效果,当时看了别人的实现思路,以为自己听懂了,然后没太管,感觉太简单,但是这次做的一个项目中要用到动画效果,想着如果自己都手写一下就太麻烦了,于是想着自己实现一下这个完美运动框架,但是实现的过程中发现,其实没有那么简单,要写一个完美运动框架,那么他就要适合改变各种属性,那么他的参数必须有两个,一个是要改变的元素,第二个是要改变的属性,为了实现多个属性同时运动,我们的第二个参数需要是
js 中使if条件成立的并不只有true
只要if()语句里的的条件不是以下之一,就会执行: if(""){ alert(""); } if(0){ alert(0); } if(false){ alert("false"); } if(null){ alert("null"); } if(undefined){ alert("undefined"); } 也就是说 if语句的的条件是非空白
JS完美运动框架详解——原理分析及demo
1.运动原理 Js运动,本质来说,就是让 web 上 DOM 元素动起来。而想要 DOM 动起来,改变其自身的位置属性,比如高宽,左边距,上边距,透明度等。还有一个很重要的前提是,运动的物体必须是绝对定位。 window.onload = function(){ var oBtn = document.getElementById('btn'); oBtn.oncl
原生js封装元素运动函数
首先看看演示效果 代码, 函数参数obj为当前想要变动的元素, changeData为想要变动的种类, 例如, func为元素动作结束后想要处理的函数例如向上面那个演示, 注意: opacity要乘以100, 原因见如下代码var div = document.getElementsByClassName('demo')[0]; startMove(div, {width:200 ,
封装js运动函数
//js封装函数 function getstyle(obj, name) { if(obj.currentStyle) { return obj.currentStyle[name]; //ie浏览器获取非行间样式的值 } else { return getComputedStyle(obj, false)[name]; //非ie浏览器获取非行间样式的值 } } /
toggle函数不是点击了才调用么?怎么我的初始状态只是一瞬间就被替代了,而且还替换后的样式也不太对
你用的jquery.1.11.2.js,jquery从1.9开始就不再支持toggle方法了。你可以试试把你引用jquery的地方删除,换成下面的。 1 script src="http://libs.baidu.com/jquery/1.8.3/jquery.min.js">
js运动框架 blue
js运动框架 bluejs运动框架 bluejs运动框架 bluejs运动框架 blue
JS学习笔记(五):关于$(function(){});里面的函数不执行问题
原因是 (1)$(function(){})里面不能写函数,只能写js语法 (2)没有引入jquery 如下: $(function(){ sayHello();//此时运行程序会弹出hello }); function sayHello() { alert("hello"); }
js缓冲运动和匀速运动
1.缓冲运动 js缓冲运动 #div1{ height: 100px; width: 100px; background-color: red; position: absolute; left: 0px;/*700px*/