弹出框显示2秒后，自动消失

最新推荐文章于 2022-11-22 13:52:55 发布

weixin_36351204

最新推荐文章于 2022-11-22 13:52:55 发布

阅读量8.7k

点赞数

分类专栏： web前段文章标签： web前段

本文链接：https://blog.csdn.net/weixin_36351204/article/details/52775944

版权

web前段专栏收录该内容

2 篇文章 0 订阅

订阅专栏

显示2秒后消失的方法

<script>

        jQuery(document).ready(function($) {

            $('.theme-login').click(function(){
               $('.theme-popover-mask').fadeIn(100);
               $('.theme-popover').slideDown(200);
               setTimeout(function() {
                   console.log('22222222222');

                   $('.theme-popover-mask').fadeOut(100);
                   $('.theme-popover').slideUp(200);

               }, 1000);

            })
            $('.theme-poptit .close').click(function(){
                $('.theme-popover-mask').fadeOut(100);
                $('.theme-popover').slideUp(200);
            })
        })
    </script>

</head>
<body >
    <from>
        <div style="margin-top: 50px; margin-left: 605px;">
            <h3>请输入文字：企业湾</h3></br>
            <input type="text" style="width: 160px;height: 30px">
        </div>
        <div class="theme-buy">
            <a class="btn btn-primary btn-large theme-login" href="javascript:;">一键分享朋友圈</a>
        </div>
        <div class="theme-popover">
            <div class="theme-poptit">
                <a href="javascript:;" title="关闭" class="close">×</a>
            </div>
            <div class="theme-popbod dform">
                <form class="theme-signin" name="loginform" action="" method="post">
                    <ol>
                        <li><h2>任务完成，你真棒！</h2></li>
                    </ol>
                </form>
            </div>
       </div>
    </form>
</body>
</HTML>