首页 > 代码库 > 一排下去再上来的div
一排下去再上来的div
<!DOCTYPE HTML><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>无标题文档</title><script src="http://www.mamicode.com/float.js"></script><script type="text/javascript">window.onload = function (){ var timer = null ; var num = 0; var len = 20; var str = ‘‘; var adiv = document.getElementsByTagName(‘div‘); var finished = true; var flag = true; for( var i = 0; i < len; i++) { str += ‘<div style="width:50px; height:50px; background:red; position:absolute; top:0px; left:‘+ i*60 +‘px;"></div>‘; } document.body.innerHTML = str; document.onclick = function () { if(!finished) {return ;} finished = false; clearInterval(timer); timer = setInterval( function () { domove(adiv[num],‘top‘,23,flag?500:0,num == len - 1?function (){ finished = true;flag = !flag; }:null); num++; if(len == num ) { clearInterval(timer); num = 0; } },100); }};</script></head><body></body></html>
function getstyle(obj,attr){ return obj.currentStyle?obj.currentStyle[attr]:getComputedStyle(obj)[attr];}function domove (obj,attr,dir,target,endfn){ dir = parseInt(getstyle(obj,attr))<target?dir:-dir; clearInterval(obj.timer); obj.timer = setInterval( function () { var speed = parseInt(getstyle(obj,attr)) + dir; if(dir>0&&speed>target||dir<0&&speed<target) { speed = target; } obj.style[attr] = speed + ‘px‘; if( speed == target ) { clearInterval(obj.timer); endfn&&endfn(); } },30); };
一排下去再上来的div
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。