javascript - 闪烁 DIV 5 秒，然后在 1 秒后使用 jQuery 将其隐藏

Question

我有一个<div>我每 5 秒“闪烁”一次的，这是我的代码：

var blink = function() {
    $('.leftArrowMask').toggle();
};

$(document).ready(function() {
    setInterval(blink, 5000);   
});

我想改变它，使闪烁效果每 5 秒发生一次，但只闪烁 1 秒。目前它保持可见 5 秒持续时间，然后隐藏 5 秒。

我已经尝试过上面的代码，但我认为这不太对。我怎样才能达到我的要求？

score 3 · Accepted Answer

试试这个...

    var blink1 = function() {
    $('.leftArrowMask').hide();
    setTimeout(blink2, 5000);
};
var blink2 = function() {
    $('.leftArrowMask').show();
    setTimeout(blink1, 1000);
};
$(document).ready(function() {
    setTimeout(blink1, 1000);
});

它首先运行 blink1 隐藏 div，然后在 1 秒后运行 blink2 以显示 div。5 秒后，Blink2 又再次运行 blink1。

score 1 · Accepted Answer

var blink = function() {
    $('.leftArrowMask').hide();
    setTimeout(function(){$('.leftArrowMask').show()},1000);

};

$(document).ready(function() {
    setInterval(blink, 5000);   
});

工作演示

score 0 · Accepted Answer

0

在您的设置间隔函数中使用 setTimeOut 函数

于 2013-07-23T10:08:32.083 回答

score -1 · Accepted Answer

var blink = function() {
    $('div').hide();
    setTimeout(function(){$('div').show()},1000);
};

$(document).ready(function() {
    setInterval(blink, 5000);   
});

        div{
    width:100px;
    height:100px;
    background:red;
}

<!DOCTYPE html>
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>
<body>

<div></div>

</body>
</html>

javascript - 闪烁 DIV 5 秒，然后在 1 秒后使用 jQuery 将其隐藏

4 回答 4

Related

Reference