退出PopUp无法正常工作

时间:2016-05-17 01:14:24

标签: php jquery html css popup

所以小伙子们,我有一个退出的PopUp,它已经有效,但当我向下滚动网站页面时,它不会再出现了。请帮我找到问题所在。我真的不知道什么是错的。 好吧,对不起英语不好

<script type="text/javascript" src="asset/jquery.min.js"></script>
<script type="text/javascript">
      $(function(){
        $(document).mousemove(function(e) {     
            $('#exitpopup').css('left', (window.innerWidth/2 - $('#exitpopup').width()/2));
            $('#exitpopup').css('top', (window.innerHeight/2 - $('#exitpopup').height()/2));
            if(e.pageY <= 5)
            {
                // Show the exit popup
                $('#exitpopup_bg').fadeIn();
                $('#exitpopup').fadeIn();
            }
        });
        $('.close').click(function(){
        $('#exitpopup_bg').fadeOut();
            $('#exitpopup').fadeOut();
    });
        $('#exitpopup_bg').click(function(){
            $('#exitpopup_bg').fadeOut();
            $('#exitpopup').slideUp();
        });
    });

</script>
<style type="text/css">
    #exitpopup{
        text-align:center;
    }
    #exitpopup h1{
        margin-top:0px;
        padding-top:0px;    
    }   
    #exitpopup p{
        text-align:left;
    }
</style>
<div style="display: none; width:100%; height:100%;  position:fixed; background:black; opacity: .3; filter:alpha(opacity=0.8); z-index:999998;" id="exitpopup_bg">

</div>
    <div style="width:50%; height:auto; margin:0px auto; display:none;position:fixed; color:#ffffff; padding:20px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; z-index:999999;" id="exitpopup">
    <img src="asset/PopUp.png" />           
</div>

1 个答案:

答案 0 :(得分:2)

问题在于

if(e.pageY <= 5)

滚动后无法捕捉到e.pageY <= 5所以你需要

if(e.pageY - $(window).scrollTop() <= 5)

Demo Here