弹框，点击显示和隐藏

<!--微信弹层-->

<div class="cl bgtk_01"></div>
<div class="wxtk">
     <div class="gbico1"></div>
    <p><img src="images/ewm_03.jpg"></p>
    <p>扫码关注<br/>随时联系人工客服</p>
</div>

.bgtk_01{ width:100%;height:100%;position: fixed;top:0px;left: 0px;background: #000;opacity: 0.6;filter: alpha(opacity=60) \9;z-index: 99; display:none;}
.wxtk{ width:2.8rem; height:4rem; background:#FFF;border-radius:0.1rem; position:fixed; left:50%; top:50%; margin:-2.9rem 0 0 -1.4rem; z-index:9999; display:none;}
.gbico1{ background:url(../images/ico2.png) no-repeat; width:0.24rem; height:0.24rem; background-size:0.24rem 0.24rem; float:right; margin:0.1rem 0.1rem 0.1rem 0; opacity:0.5; cursor:pointer;}
.wxtk p img{ width:2.4rem; height:2.4rem; display:block; margin:0.2rem auto;}
.wxtk p{ text-align:center; font-size:0.24rem; color:#666; clear:both;}



<script type="text/javascript" src="https://style.org.hc360.com/js/build/source/core/jquery.min.js"></script>

<script type="text/javascript">

        $(document).ready(function(){

          
            $(".a00").hover(function(){

                $(".adh_1").animate({right:"-0.4rem"},300)
                
                },function(){
            
                $(".adh_1").animate({right:"-2.1rem"},300)

            })
            
            
            $(".a01").click(function(){
                $(".bgtk_01").show();
                $(".wxtk").show();
            })
            $(".bgtk_01,.gbico1").click(function(){
                $(".bgtk_01").hide();
                $(".wxtk").hide();
            })
            
    
              
        });
</script>