在img上设置闪烁动画的时间

Setting a time for flicker animation on img

本文关键字：动画 时间 闪烁 设置 img      更新时间：2023-09-26

我使用这个代码使我的标志在我的网站上闪烁。但是当它在浏览时继续闪烁时就变得很烦人，我如何设置一个时间让它在页面加载时闪烁15秒，然后停止?

JS代码我正在使用: 

$(document).ready(
function(){
    var t;
    const fparam = 100;
    const uparam = 100;
    window.flickr = function(){
        if(Math.round(Math.random())){
            $("#logodcoi").css("visibility","hidden");
            t = setTimeout('window.unflickr()',uparam);
        }
        else
            t = setTimeout('window.flickr()',fparam);
    }
    window.unflickr = function(){
        if(Math.round(Math.random())){
            $("#logodcoi").css("visibility","visible");
            t = setTimeout('window.flickr()',fparam);
        }
        else
            t = setTimeout('window.unflickr()',uparam);
    }
    t = setTimeout('window.flickr()',fparam);
});

您可以有一个计数器，然后使用它来决定是否要设置另一个超时。作为旁注，您永远不应该向窗口添加函数，然后将字符串传递给setTimeout。总是只传递函数本身:

$(document).ready(function(){
    var t;
    var amount = 0;
    const fparam = 100;
    const uparam = 100;
    function timeout(f, t) {   // this function delegates setTimeout
        if(amount++ < 150) {   // and checks the amount already (un)flickered
             setTimeout(f, t); // (150 * 100 ms = 15 s)
        }
    }
    var flickr = function(){
        if(Math.round(Math.random())){
            $("#logodcoi").css("visibility","hidden");
            t = timeout(unflickr,uparam);
        }
        else
            t = timeout(flickr,fparam);
    };
    var unflickr = function(){
        if(Math.round(Math.random())){
            $("#logodcoi").css("visibility","visible");
            t = timeout(flickr,fparam);
        }
        else
            t = timeout(unflickr,uparam);
    };
    t = timeout(flickr,fparam);
});

我看到你正在使用jquery，你可以使用以下，如果我没记错的话，我下面使用的所有东西都是从1.0开始的jquery，所以你应该很好:

counter = 1;
function hideOrShow(){
             $(".classToSelect").animate({"opacity": "toggle"}, 100);
             counter = counter +1;
             if (counter >= 21) clearInterval(flickerInterval);
}
flickerInterval = setInterval(hideOrShow, 100);

将选择器、动画持续时间和变量名称更改为您喜欢/需要的任何内容。

相关文章：