84669 Lernen von Personen
152542 Lernen von Personen
20005 Lernen von Personen
5487 Lernen von Personen
7821 Lernen von Personen
359900 Lernen von Personen
3350 Lernen von Personen
180660 Lernen von Personen
48569 Lernen von Personen
18603 Lernen von Personen
40936 Lernen von Personen
1549 Lernen von Personen
1183 Lernen von Personen
32909 Lernen von Personen
闭关修行中......
<!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) } } }
那就不要直接判断相等