美文网首页我爱编程
jQuery总结(十二)--点击后3秒消失

jQuery总结(十二)--点击后3秒消失

作者: 风的低语 | 来源:发表于2018-06-20 14:46 被阅读28次

delay 为延迟时间
fadeOut 使用淡出效果来隐藏被选元素

<!DOCTYPE HTML>
<html>
<head>
<meta charset=UTF-8>
<title>recursion</title>
<style type="text/css">
body {
    overflow: hidden;
}
</style>
<script type="text/javascript" src="jquery-1.8.0.min.js"></script>
<script type="text/javascript">
    $ (function ()
    {
        $ (':button').click (function ()
        {
            $ ('div').show ().delay (3000).fadeOut ();
        });
    });
</script>
</head>
<body>
    <button>alert</button>
    <div
        style="display: none; width: 1265px; height: 784px; position: absolute; top: 0px; left: 0px; background-color: rgb(45, 45, 45); z-index: 5000; opacity: 0.2; background-position: initial initial; background-repeat: initial initial;"></div>
</body>
</html>

相关文章

网友评论

    本文标题:jQuery总结(十二)--点击后3秒消失

    本文链接:https://www.haomeiwen.com/subject/wsfysftx.html