首页 > 代码库 > 文字搬运
文字搬运
<!doctype html><html><head><meta charset="utf-8"><title>无标题文档</title><style>*{ margin:0px; padding:0px; }body{ background:#C0C0C0; }#progress{ opacity:0; } li{ list-style:none; display:inline-block; width:8px; height:10px; margin:2px; background:#E7A521; } #wrap{ margin:50px auto; width:800px; background:#fff; overflow:hidden; padding:20px; border-radius:10px; }textarea{ background:#EFEFD6; width:320px; height:220px; float:left; padding:10px; font-size:18px; border:medium none; }#center{ float:left; width:120px; text-align:center; }#center ul { margin: 0px; padding: 0px; font-size: 0px;} #center a{ display:block; color:#fff; background:#F76300; text-decoration:none; padding:10px; margin:0px 5px; font-family:"微软雅黑"; }#center p{ font-size:20px; font-family:"微软雅黑"; }#right{ width:320px; height:220px; background:#63EFF7; float:right; padding:10px; } </style><script type="text/javascript" src="http://www.mamicode.com/float.js"></script><script type="text/javascript">window.onload = function (){ var obtn = document.getElementsByTagName(‘a‘)[0]; var otext = document.getElementsByTagName(‘textarea‘)[0]; var oright = document.getElementById(‘right‘); var oall = document.getElementById(‘all‘); var ocurrent = document.getElementById(‘current‘); var oprogress = document.getElementById(‘progress‘); var str = ‘‘; var arr = []; var timer = null; obtn.onclick = function () { clearInterval(timer); if( otext.value =http://www.mamicode.com/= ‘‘ ) { alert(‘请输入内容！‘); } else { str = otext.value; arr = str.split(‘‘); var ali = document.getElementsByTagName(‘li‘); obtn.style.opacity = ‘0.5‘; var m = n = 0; ocurrent.innerHTML = 0; oall.innerHTML = arr.length; oright.innerHTML = ‘‘; opacity(oprogress,10,100,20); timer = setInterval( function () { var oif = otext.value; otext.value = oif.substring(1); oright.innerHTML += arr[m]; m++; ocurrent.innerHTML = m; for ( var i = 0; i <ali.length; i++) { ali[i].style.background = ‘yellow‘; } ali[n].style.background = ‘red‘; n++; if( n == ali.length) { n = 0; } if( m == arr.length ) { clearInterval(timer); obtn.style.opacity = ‘1‘; opacity(oprogress,10,0,20) } },50) } };}</script></head><body><div id="wrap"> <textarea id="left"></textarea> <div id="center"> <a href="javascript:" style="opacity:1;">把文字向右</a> <p> <span id="current"> 0 </span> / <span id="all"> 0 </span> </p> <ul id="progress"> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> </ul> </div> <div id="right"></div></div></body></html>
function getstyle(obj,attr){ return obj.currentStyle?obj.currentStyle[attr]:getComputedStyle(obj)[attr];}function domove (obj,attr,step,frequency,target,endfn){ step = parseInt(getstyle(obj,attr))<target?step:-step; clearInterval(obj.timer); obj.timer = setInterval( function () { var speed = parseInt(getstyle(obj,attr)) + step; if(step>0&&speed>target||step<0&&speed<target) { speed = target; } obj.style[attr] = speed + ‘px‘; if( speed == target ) { clearInterval(obj.timer); endfn&&endfn(); } },frequency); };function opacity(obj,step,target,frequency,endfn){ var currentOpacity = getstyle(obj,‘opacity‘) * 100; step = currentOpacity < target?step:-step; clearInterval(obj.opacity) obj.opacity = setInterval (function () { currentOpacity = getstyle(obj,‘opacity‘) *100; var nextOpacity = currentOpacity + step; if(step>0&& nextOpacity>target || step<0&& nextOpacity < target ) { nextOpacity = target; } obj.style.opacity = nextOpacity/100; obj.style.filter = ‘alpha(opacity:)‘ + nextOpacity +‘)‘; if(nextOpacity == target ) { clearInterval(obj.opacity); endfn&&endfn(); } },frequency); };function shake(obj,attr,endfn){ if( obj.shaked ) { return; } obj.shaked = true; var num = 0; var timer = null; var arr = []; var pos = parseInt(getstyle(obj,attr)); 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(); obj.shaked = false; } },50);};
文字搬运
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。