添加一个 SetTimeout 和过渡到 jQuery Show / Hide答案

【问题标题】：Adding a SetTimeout and transition to jQuery Show / Hide添加一个 SetTimeout 和过渡到 jQuery Show / Hide
【发布时间】：2023-03-28 07:42:01
【问题描述】：

我正在尝试向 jQuery Show / Hide 调用添加 SetTimeout 和动画类型转换。下面是我目前拥有它的方式，但我想添加“显示”div 在恢复为原始#bg_dv 之前保持显示的特定时间量。如果可能的话，我还想在效果之间添加动画过渡。

   function tilt(){
    $("#area1").click(function(){
        $("#bg_div").hide();
        $("#bg_skew").show(); // I would like to show this Div for about 5 seconds
 // and then have original back. 
       });
    }

【问题讨论】：

标签： javascript jquery

【解决方案1】：

$("#bg_div").hide(0).delay(5000).show(0);
$("#bg_skew").show(0).delay(5000).hide(0);

如果你想要动画，你可以用适当的东西替换对hide() 和show() 的调用。例如fadeIn() 和fadeOut()。

【讨论】：

我不相信这行得通。如果没有参数，.show 或.hide 不是动画方法，因此.delay 对它们没有任何影响。
你说得对。我已经更新了我的答案，包括一个将它们变成动画方法的持续时间。

【解决方案2】：

    $("#area1").click(function(){

        $("#bg_div").fadeOut('fast',function(){
             $("#bg_skew").delay(5000).fadeIn('fast');
        });


    });

为了防止缓存多次点击，让动画播放多次你也应该看看

.stop(true,true)

在任何动画之前。还请查看此动画选项 - 属性。

{cache:false}

【讨论】：

【解决方案3】：

就是这么简单。只需在 show.delay(5000) 中输入毫秒数，它就会延迟 5 秒。

语法：

$(selector).delay(speed)

speed: 以毫秒为单位的时间，例如5000 持续 5 秒。

$(selector).show(speed,easing,callback)

speed: 这里以毫秒为单位，比如 1000 表示 1 秒。

easing：它定义了元素在不同点的速度，即“线性”“摆动”。

callback: 在这里你可以把你的函数在完成 show 方法后执行。例如，当您在显示图像后单击按钮显示图像时，它将执行功能，例如 .show(1000,function(){alert("hello")};);

希望对你有所帮助。

【讨论】：

它不会延迟执行。动画的持续时间为 5 秒。
哦，是的。对不起我的错误thanx