84669 orang belajar
152542 orang belajar
20005 orang belajar
5487 orang belajar
7821 orang belajar
359900 orang belajar
3350 orang belajar
180660 orang belajar
48569 orang belajar
18603 orang belajar
40936 orang belajar
1549 orang belajar
1183 orang belajar
32909 orang belajar
闭关修行中......
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>toggle</title> <script type="text/javascript"> window.onload = function(){ var x,y,speed,ar1,y1,s,yh,timer,animationRunning=false; x = document.getElementById('bt'); y = document.getElementById('co'); s = function(ar1,y1,yh){ if(animationRunning){ return; } clearInterval(timer); var target=((ar1===-1)?0:yh); timer = setInterval(function(){ animationRunning=true; if(y1.offsetHeight<5){ speed= Math.ceil((target-5)/5); }else{ speed = Math.ceil((target-y1.offsetHeight)/5); } if(y1.offsetHeight===target){ animationRunning=false; clearInterval(timer); return; } y1.style.height = y1.offsetHeight + speed + "px"; },20) }; x.onclick = function(){ if(y.offsetHeight===0){ s(1,y,400); }else{ s(-1,y,400) } } } function test(e,number){ console.log(number); } </script> </head> <body> <button type="button" id="bt">Event</button> <p id="co" style="background-color:red;width:200px;height:0;"> </p> <input name="sdf" onkeyup="return test(this,value);"/> </body> </html>
那就不要直接判断相等
y1.offsetHeight>yh
window.onload = function(){ var x,y,speed,ar1,y1,s,yh,timer; x = document.getElementById('bt'); y = document.getElementById('co'); s = function(ar1,y1,yh){ clearInterval(timer); timer = setInterval(function(){ speed = ar1*(yh-y1.offsetHeight)/5;(这里做下处理,当速度小于某值的时候等于某值) speed = speed?Math.ceil(speed):Math.floor(speed); if (y1.offsetHeight===yh){ console.log(y1.offsetHeight) clearInterval(timer); }else{ y1.style.height = y1.offsetHeight + speed + "px"; } },20) } x.onclick = function(){ if(y.offsetHeight < 5){ s(1,y,400); }else{ s(1,y,0) //改个传参就行了 } } }
window.onload = function() { var x, y, speed, ar1, y1, s, yh, timer; x = document.getElementById('bt'); y = document.getElementById('co'); s = function(ar1, y1, yh) { clearInterval(timer); timer = setInterval(function() { speed = ar1 * (yh - y1.offsetHeight) / 5; console.log(speed); speed = speed ? Math.ceil(speed) : Math.floor(speed); console.log(speed); speed == -0 ? speed = -(y1.offsetHeight) : ''; //当speed减少为-0的时候,直接变成p高度使p减少为0。否则无法取消定时器。 if (y1.offsetHeight === yh) { clearInterval(timer); } else { y1.style.height = y1.offsetHeight + speed + "px"; } }, 20) } x.onclick = function() { if (y.offsetHeight < 5) { s(1, y, 500); } else { s(1, y, 0) } } }
那就不要直接判断相等