Setinterval似乎运行在1500毫秒而不是50毫秒

时间:2018-05-20 00:16:19

标签: javascript setinterval

我有一个设置间隔函数,虽然设置为50毫秒,但似乎在1500毫秒运行。如果你看一下这个脚本,它会缩小一个元素并将其震动几度,我希望它能够顺利运行,因为它确实在大约1500ms运行。有帮助吗?将setInterval表单1000更改为500几乎没有效果,并且当您继续将值减半时,该趋势将继续。我似乎无法在网上找到为什么会出现这种情况......

   var rotated = false;
var height = 24.6;
var width = 15

var points = 0;
var cutvalw = 1;
var cutvalh = 1.64;
var val = 10;


document.querySelector("#box").addEventListener("click", function () {
  width = width - cutvalw;
  height = height - cutvalh;
  var div = document.getElementById("box"),
      deg = rotated ? 0 : 22;

  div.style.webkitTransform = "rotate("+deg+"deg)";
  div.style.mozTransform    = "rotate("+deg+"deg)";
  div.style.msTransform     = "rotate("+deg+"deg)";
  div.style.oTransform      = "rotate("+deg+"deg)";
  div.style.transform       = "rotate("+deg+"deg)";

  setTimeout(res, 140);
});
 function res() {
  var div = document.getElementById("box"),
      deg = rotated ? 0 : 0;
  div.style.webkitTransform = "rotate("+deg+"deg)";
  div.style.mozTransform    = "rotate("+deg+"deg)";
  div.style.msTransform     = "rotate("+deg+"deg)";
  div.style.oTransform      = "rotate("+deg+"deg)";
  div.style.transform       = "rotate("+deg+"deg)";
  }
setInterval(gamerule, 50);
function gamerule() {
   var div = document.getElementById("box");
  div.style.width           = width + "%";
  div.style.height          = height + "%";

  if (width < 1) {
    width = 15;
     height = 24.6;
    document.getElementById("cont").style.pointerEvents = "none";
    setInterval(ser, 1000);
    points++;
    function ser() {
         document.getElementById("cont").style.pointerEvents = "all";
    }
   }
}



setInterval(gamefunc, 500);

function gamefunc() {
  if (val >= 10) {
  width = width - .5;
  height = height - .5;
   var div = document.getElementById("box"),
      deg = rotated ? 0 : 22;

  div.style.webkitTransform = "rotate("+deg+"deg)";
  div.style.mozTransform    = "rotate("+deg+"deg)";
  div.style.msTransform     = "rotate("+deg+"deg)";
  div.style.oTransform      = "rotate("+deg+"deg)";
  div.style.transform       = "rotate("+deg+"deg)";

  setTimeout(res, 140);
};
  function res() {
 var div = document.getElementById("box"),
       deg = rotated ? 0 : 0;
  div.style.webkitTransform = "rotate("+deg+"deg)";
  div.style.mozTransform    = "rotate("+deg+"deg)";
   div.style.msTransform     = "rotate("+deg+"deg)";
  div.style.oTransform      = "rotate("+deg+"deg)";
  div.style.transform       = "rotate("+deg+"deg)";
 val = 9;
   setTimeout(game, 1000);
  function game() {
    val = 10;
  }
  }
}

1 个答案:

答案 0 :(得分:0)

你的花括号可能有问题,但我不能完全告诉你要做什么。功能&#34; gameFunc&#34;实际上是在创建一个名为&#34; res&#34;在每次执行时,如果val大于或等于10,则仅运行转换。当然,创建函数实际上并不执行该函数,这可能是为什么区间不会出现的原因开枪。

也许:

for (key in dog)